又好久沒有寫博客了，這段時間用到了日期控件fullcalendar，今天來做個總結，方便以后使用：
一、引入文件1.1 引入的js文件<script type="text/javascript" src='calendar/js/jquery.min.js'></script> <script type="text/Javascript" src='calendar/js/jquery-ui.min.js'></script> <script type="text/javascript" src='calendar/js/fullcalendar.min.js'></script>
在添加新的日程時候用到了fancybox的彈出框，還使用到了AjaxForm提交表單，因此引入了這兩個js
<script type="text/javascript" src='calendar/js/jquery.fancybox.js'></script> <script type="text/javascript" src="calendar/js/jquery.form.min.js"></script>
如果用到其他的功能，那么在加入其他的js文件即可。
1.2 引入的CSS文件<link rel="stylesheet" type="text/css" href="calendar/css/jquery-ui.css"> <link rel="stylesheet" type="text/css" href="calendar/css/fullcalendar.css"> <link rel="stylesheet" type="text/css" href="calendar/css/fancybox.css">
主要的就這三個，如果有其他要求可以自己根據需求添加。
二、初始化2.1 頁面初始化在jsp頁面上要有一個具體的位置來顯示calendar控件
<div class="col-md-9"> <div id='calendar'></div></div>2.2 JS初始化
用JQUERY選擇上面的id為calendar的DIV進行fullcalendar初始化：
$(function() { $('#calendar').fullCalendar( { //options }）；}）；2.3 初始化參數2.3.1 headerheader : { left : 'PRev,next today', center : 'title', right : 'month,agendaWeek,agendaDay' }header定義日歷頂部的標題和按鈕,如果header設置為false，那么將不顯示日歷上方的標題和按鈕，還可以設置的兩個參數為：precYear和nextYear。
2.3.2 editableeditable為boolean類型，決定在日歷中的事件是否可以更改，例如從一個日期拖拽到另一個日期，或者修改事件時間長短。
editable為true,那么事件可以同時進行日歷內部拖拽和設置事件時間長短，如果設置為false，那么兩者都不可以實現。
如果editable為false，并且要可以設置事件拖拽，那么可以將eventStartEditable設置為true；如果editable為false，并且要可以設置事件時間長短，那么可以將eventDurationEditable設置為true。
editable: true,2.3.3 theme
theme: true,
theme決定是否使用JQUERYUI的Theme，boolean類型，如果設置為true,在使用JQUERYUI的theme的同時還需要引入需要的其他的CSS文件。
2.3.4 dragOpacitydragOpacity: { agenda: .5, '':.6 },dragOpacity表示事件拖動時候的不透明度，agenda表示對于agenda視圖，’’表示其他視圖。
2.3.5 eventDropeventDrop是事件從一個日期時間拖拽到另一個日期時間后的回調函數。
function (event,delta,revertFunc,jsEvent,ui,view) {}event:包含拖拽的事件信息（名稱、時間等）的事件對象；
delta:拖拽對象，包含事件移動的時間信息，可以有dayDelta表示事件拖拽移動的天數，minuteDelta表示移動的分鐘數；
revertFunc:是一個函數，表示如果ajax請求失敗，那么就把事件返回到拖拽之前的位置；
allDay如果是月視圖，或者是agenda視圖的全天日程，此值為true,否則為false;
2.3.5.1 前臺實現/****** drag the event from a time and drop it to a different time ******/ eventDrop: function(event,dayDelta,minuteDelta,allDay,revertFunc) { var url = "。。。。。"; $.post(url,{id:event.id,days:dayDelta,minutes:minuteDelta}, function(msg){ if(msg != 1){ alert(msg); revertFunc(); } }); },使用AJAX將參數傳遞到后臺，如果事件拖拽成功，那么久將成功后的事件的信息存儲到數據庫，如果失敗返回給前臺提示信息，并且將拖拽的事件返回到原來的位置，此處所說的拖拽是指在控件內部的拖拽，例如將一個事件從8月7號拖拽到8月10號。
2.3.5.2 后臺實現action實現：
private Integer id; private int days; private int minutes; /*get/set*/ /** * @return "1" returns if the deploy succeed or "failed" * @throws IOException */ public String drag() throws IOException { response.setContentType("text/plain"); PrintWriter out = response.getWriter(); boolean success = agendaServ.drag(id, days, minutes); if(success){ out.print("1"); } else { out.print("failed"); } out.flush(); out.close(); return null; }service實現：
/** * change the date of agenda by drag the extends to different date * @return */ public boolean drag(Integer id, int days, int minutes) { long diff = days * 86400000; Agenda agenda = agendaDAO.findById(id); if(!agenda.isAllDay()){ diff += minutes * 60000; } // add the changed time to start and end Date start = agenda.getStart(); start.setTime(start.getTime() + diff); agenda.setStart(start); Date end = agenda.getEnd(); if(end != null){ end.setTime(end.getTime() + diff); agenda.setEnd(end); } // update return agendaDAO.update(agenda); }在Service層中需要判斷事件是否是全天事件，如果不是全天事件，那么需要將傳遞過來的天數和分鐘數全部轉換成毫秒數，原來的時間加上移動的時間才是移動之后的時間，不管是開始時間還是結束時間都需要處理，處理完成之后使用持久化層修改該事件即可。
2.3.6eventResizeeventResize為設置事件時間長短的回調函數；
eventResize函數的參數和eventDrop函數的參數一樣，需要知道更改的天數和分鐘數，通過AJAX請求修改事件，具體實現如下：
2.3.6.1 前臺實現/****** change the event duration ******/ eventResize: function(event,dayDelta,minuteDelta,revertFunc) { var url = "/wldproject/agenda/resize"; $.post(url,{id:event.id,days:dayDelta,minus:minuteDelta},function(msg){ if(msg != 1){ alert(msg); revertFunc(); } }); },2.3.6.2 后臺實現action實現：
private Integer id; private int days; private int minutes; /*get/set*/ public String resize() throws IOException { response.setContentType("text/plain"); PrintWriter out = response.getWriter(); boolean success = agendaServ.resize(id, days, minutes); if(success){ out.print("1"); } else { out.print("failed"); } out.flush(); out.close(); return null; }service實現：
/** * change the date of agenda by resize the extends * @return */ public boolean resize(Integer id, int days, int minutes) { long diff = days * 86400000; Agenda agenda = agendaDAO.findById(id); if(agenda.isAllDay()){ diff += minutes * 60000; } // add the changed time to end date without start Date end = agenda.getEnd(); if(end != null){ end.setTime(end.getTime() + diff); } else { Date start = agenda.getStart(); end = new Date(start.getTime() + diff); } agenda.setEnd(end); // update return agendaDAO.update(agenda); }2.3.7selectable 允許用戶點擊選中一天或者拖拽選中多天，boolean類型，設置為true時才能選中。
選中一天或者多天時，具有select和unselect回調函數。
2.3.8 selectselectable設置為true時，表示可以選中一天或者多天，select為此時的回調函數；
2.3.8.1 前臺實現/****** select sevral days ******/ selectable: true, select: function(startDate, endDate, allDay, jsEvent, view ){ var start = $.fullCalendar.formatDate(startDate,'yyyy-MM-dd'); var end = $.fullCalendar.formatDate(endDate,'yyyy-MM-dd'); if(start == end){ end=""; } var params = { "action" : "add", "fromdate" : start, "todate" : end, "allDay" : allDay, }; var url = '。。。。。?' + $.param(params); $.fancybox({ 'type':'ajax', 'href':url, }); },startDate：開始時間；
endDate:結束時間；
allDay：布爾類型，是否是全天事件；
$.fullCalendar.formatDate(startDate,'yyyy-MM-dd')格式化事件的開始時間和結束時間。
選中一天或者多天之后進行添加事件，使用fancybox的方式彈出添加頁面，彈出時需要將開始時間、結束時間等參數傳遞到彈出的頁面上，彈出頁面效果如下：
提交表單，關閉彈出的窗口，刷新父窗口頁面即可，此處使用ajaxForm異步提交表單：
//提交表單 $("#add_form").ajaxForm({ beforeSubmit: showRequest, //表單驗證 success: showResponse //成功返回 });function showRequest(){ var events = $("#event").val(); if(events == ""){ alert("請輸入日程內容！"); $("#event").focus(); return false; } if(confirm("請確定？")){ } else { return false; }}function showResponse(responseText, statusText, xhr, $form){ if(statusText=="success") { if(responseText == "1") { $.fancybox.close(); //重新獲取所有事件數據 $("#calendar").fullCalendar("refetchEvents"); } else { alert(responseText); } } else { alert(statusText); }}2.3.8.2 后臺實現private String action; private Integer id; private String islong; private String title; private String allday; private String user; private String supporter; private String level; private String start; private String s_hour; private String s_minute; private String end; private String e_hour; private String e_minute; /*get/set*/ private String add() throws IOException { boolean success = false; Agenda agenda = new Agenda(); agenda.setTitle(title); agenda.setStartTime(start, allday, s_hour, s_minute); if(islong.equals("1")){ agenda.setEndTime(end, allday, e_hour, e_minute); } agenda.setColor(level); agenda.setBoolday(allday); agenda.setUser(user); agenda.setSupporter(supporter); if(action.equals("edit")){ agenda.setId(id); success = agendaServ.update(agenda); } else if(action.equals("add")){ success = agendaServ.add(agenda); } if(success){ return "1"; } return "add failed!!!"; }之所以是修改和新增在一個方法中是因為彈出窗口是一個頁面，根據傳遞過去的參數action的值判斷是新增還是修改，彈出窗口頁面如下：
<%@ page language="java" pageEncoding="utf-8"%><%@ page import="java.net.URLDecoder"%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%><% String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/"; // 新建還是進行修改，若未修改，獲取ID String header = "新建事件"; String id = ""; String action = request.getParameter("action"); if(action.equalsIgnoreCase("edit")){ header = "編輯事件"; id = request.getParameter("id"); } // 事件title String title = request.getParameter("title"); if(title == null){ title = ""; } else { title = URLDecoder.decode(title,"UTF-8"); } // 事件開始時間 String fromdate = request.getParameter("fromdate"); // 事件結束時間----判定是否多天事件 String todate = request.getParameter("todate"); String endStyle = "display:none"; String longDayStyle = ""; String longValue = "0"; if(todate != null && !todate.equals("")){ endStyle = ""; longDayStyle = "checked"; longValue = "1"; } // 全天事件判定 String timeStyle = "display:none"; String allDayStyle = "checked";//default all day event String allDay = request.getParameter("allDay"); String dayValue = "1"; if(allDay != null && allDay.equals("false")){// not all day event timeStyle = "display:"; allDayStyle = ""; dayValue = "0"; }%><!DOCTYPE html><html><head><base href=<%=basePath%>></head><body><div class="container" style="width:450px"><h3 class="fancy-head"><%=header%></h3><form id="add_form" class="form-horizontal" action="0000" method="post"><!-- 日程等級格式 --><div class="form-group has-warning"> <label class="col-sm-3 control-label">日程等級：</label> <div class="col-sm-8"> <select class="form-control" name="level"> <option value="black">默認等級</option> <c:forEach var="level" items="${ levelArr }"> <option value="${ level.color }">${ level.name }</option> </c:forEach> </select> </div></div><!-- 日程內容格式 --><div class="form-group has-warning"> <label for="event" class="col-sm-3 control-label">日程內容：</label> <div class="col-sm-8"> <input type="text" class="form-control" name="title" id="event" value="<%=title%>" placeholder="記錄你將要做的一件事..."> </div></div><!-- 計劃人員 --><div class="form-group has-warning"> <label for="user" class="col-sm-3 control-label">計劃人員：</label> <div class="col-sm-8"> <select class="form-control" name="user"> <c:forEach var="user" items="${ userArr }"> <option>${user.name}</option> </c:forEach> <option>其他</option> </select> </div></div><!-- 提交人員 --><div class="form-group has-warning"> <label for="supporter" class="col-sm-3 control-label">提交人員：</label> <div class="col-sm-8"> <select class="form-control" name="supporter"> <c:forEach var="user" items="${ userArr }"> <option>${ user.name }</option> </c:forEach> <option>其他</option> </select> </div></div><!-- 開始時間格式 --><div class="form-group has-warning"> <label for="start" class="col-sm-3 control-label">開始時間：</label> <div class="col-sm-8"> <input type="text" class="date datepicker" name="start" value="<%=fromdate%>"> <span id="sel_start" style="<%=timeStyle%>"> <select name="s_hour"> <c:forEach var='hour' begin='00' end='23'> <option>${hour}</option> </c:forEach> </select> <label>時</label> <select name="s_minute"> <option>00</option> <c:forEach var='minute' begin='10' end='50' step='10'> <option>${minute}</option> </c:forEach> </select> <label>分</label> </span> </div></div><!-- 結束時間格式 --><div class="form-group has-warning" id="p_endtime" style="<%=endStyle%>"> <label for="end" class="col-sm-3 control-label">結束時間：</label> <div class="col-sm-8"> <input type="text" class="date datepicker" name="end" value="<%=todate%>"> <span id="sel_end" style="<%=timeStyle%>"> <select id="e_hour" name="e_hour"> <c:forEach var='hour' begin='00' end='23'> <option>${hour}</option> </c:forEach> </select> <label for="e_hour">時</label> <select id="e_minute" name="e_minute"> <option>00</option> <c:forEach var='minute' begin='10' end='50' step='10'> <option>${minute}</option> </c:forEach> </select> <label for="e_minute">分</label> </span> </div></div><!-- 日程類型格式 --><div class="form-group has-warning"> <label for="type" class="col-sm-3 control-label">日程類型：</label> <div class="col-sm-8"> <div class="checkbox"> <label><input type="checkbox" id="isallday" <%=allDayStyle%>>全天日程</label> <label><input type="checkbox" id="isend" <%=longDayStyle%>>多天日程</label> </div> </div></div><!-- 按鈕組格式 --><div class="form-group btn-action"> <div class="col-sm-3"> <% String okstr = "確定"; if(action.equalsIgnoreCase("edit")){ okstr = "修改"; %> <input type="button" class="btn btn-danger" id="del_event" value="刪除"> <%}%> </div> <div class="col-sm-8"> <input type="submit" class="btn btn-success" value="<%=okstr%>"> <input type="button" class="btn btn-default" value="取消" onClick="$.fancybox.close()"> </div></div><!-- hidden fields used to submit --><div class="form-group"> <input type="hidden" id="eid" name="id" value="<%=id%>"> <input type="hidden" name="action" value="<%=action%>"> <input type="hidden" id="allday" name="allday" value="<%=dayValue%>"> <input type="hidden" id="islong" name="islong" value="<%=longValue%>"></div></form></div></body><script type="text/javascript">$(function(){ /**********時間控件 time control************/ $(".datepicker").datepicker({ //regional: "zh-CN", dateFormat:"yy-mm-dd", timeFormat: 'hh:mm', stepHour: 1, stepMinute: 10, }); $("#isallday").click(function(){ if($("#sel_start").css("display")=="none"){ // all day event $("#sel_start,#sel_end").show(); $("#allday").val("0"); } else{ // not an all day event $("#sel_start,#sel_end").hide(); $("#allday").val("1"); } }); $("#isend").click(function(){ if($("#p_endtime").css("display")=="none"){ $("#islong").val("1"); $("#p_endtime").show(); } else{ $("#islong").val("0"); $("#p_endtime").hide(); } $.fancybox.resize();//調整高度自適應 }); //提交表單 $("#add_form").ajaxForm({ beforeSubmit: showRequest, //表單驗證 success: showResponse //成功返回 }); //刪除事件 $("#del_event").click(function(){ if(confirm("您確定要刪除嗎？")){ var eid = $("#eid").val(); var url = "。。。。。"; $.post(url,{id:eid},function(msg){ if(msg == '1'){//刪除成功 alert("事件刪除成功"); $.fancybox.close(); //從日程視圖中刪除該事件 $("#calendar").fullCalendar("removeEvents",eid); } else{ alert(msg); } }); } });});function showRequest(){ var events = $("#event").val(); if(events == ""){ alert("請輸入日程內容！"); $("#event").focus(); return false; } if(confirm("請確定？")){ } else { return false; }}function showResponse(responseText, statusText, xhr, $form){ if(statusText=="success") { if(responseText == "1") { $.fancybox.close(); //重新獲取所有事件數據 $("#calendar").fullCalendar("refetchEvents"); } else { alert(responseText); } } else { alert(statusText); }}</script></html>這里面帶著刪除一起給了，其實刪除是最簡單的一個。
2.3.9 eventClick點擊日歷控件中的一個事件時的回調函數，比如8月10號有一個日程是開會，那么當你點擊開會這個事件時就會通過fancybox彈出窗口，將開會這個事件的詳細信息回顯到彈出的窗口上：
2.3.9.1 前臺實現/******edit the event created ******/ eventClick: function(calEvent, jsEvent, view) { var s_Date = $.fullCalendar.formatDate(calEvent.start,'yyyy-MM-dd'); var e_Date = ""; if(calEvent.end){ e_Date = $.fullCalendar.formatDate(calEvent.end,'yyyy-MM-dd'); } var params = { "id" : calEvent.id, "title" : encodeURI(calEvent.title), "action" : "edit", "allDay" : calEvent.allDay, "fromdate" : s_Date, "todate" : e_Date }; var url = '000000/event.jsp?' + $.param(params); $.fancybox({ 'type':'ajax', 'href':url, }); }在event.jsp頁面上接收參數，處理后顯示在文本框中，提交表單即可修改，修改和新增在一個方法中。
2.3.10 eventsevents是作為加載日歷中的事件的數據源，可以直接給一個數組作為數據源，可以通過后臺傳遞到前臺的json對象。Events可以放在eventSources中使用。
2.3.10.1 前臺實現此處通過加載后臺傳遞過來的json數據加載數據：
/****** load all events ******/ events: { url: "00000", type: 'post', error: function() { alert('獲取日程事件失敗！'); }, //color:'yellow',// 背景色 //textColor:'black'// 文字顏色 }2.3.10.2 后臺實現// 自帶參數 private long start; private long end; /** * get the JSON String to display the events * * @return */ public String loadJSON() { String json = agendaServ.loadSpan(start, end); response.setContentType("text/plain"); response.setCharacterEncoding("utf-8"); PrintWriter out = null; try { out = response.getWriter(); out.print(json); } catch (IOException e) { e.printStackTrace(); } finally { if (out != null) { out.flush(); out.close(); } } return null; }如果需要向后臺傳遞參數，即帶著過濾條件加載數據，可以使用如下的方式：
為了實現當前用戶不能看到其他用戶的非公開日程的功能，在后臺加載數據的時候進行了一下過濾，即從session中拿到當前用戶，然后遍歷查詢到的日程，從中拿到非公開日程，如果日程的用戶跟當前用戶不一致，那么設置該日程的標題為個人日程。
public String loadJSON() { List<Agenda> alist = agendaService.loadSpan(start, end); SysUser sysUser = SessionUtils.getSysUserFromSession(request); for(Agenda agenda:alist){ if(!agenda.isOpen()){ if(agenda.getUser().trim().equals(sysUser.getCnname().trim())){ continue; }else{ agenda.setTitle("個人日程"); } } } String json = GsonUtil.getJson(alist); //String json = agendaService.loadSpan(start, end); response.setContentType("text/plain"); response.setCharacterEncoding("utf-8"); PrintWriter out = null; try { out = response.getWriter(); out.print(json); } catch (IOException e) { e.printStackTrace(); } finally { if (out != null) { out.flush(); out.close(); } } return null; }2.3.11 eventMouSEOver和eventMouseouteventMouseover:用戶鼠標放在事件上時的回調函數；
// Has not been complete because of the JQUERY dialog using manner // To display the detail message about the event eventMouseover: function(calEvent, jsEvent, view) { $("#agenda-content").text(calEvent.title); $("#agenda-user").text(calEvent.user); $("#agenda-start").text($.fullCalendar.formatDate(calEvent.start,'yyyy-MM-dd')); $("#win").dialog( { title: '日程詳細內容', width: 250, height: 140, hide: "slide", position: [jsEvent.clientX, jsEvent.clientY], overlay: { backgroundColor: 'blue', opacity: 0 }, } ); },eventMouseout:用戶鼠標移除事件時的回調函數；
eventMouseout: function(calEvent, jsEvent, view) { $("#win").hide(); $("#win").dialog("destroy"); },彈出的div代碼：
<div class="container"> <div class="row" id="win" style="display:none"> <div class="input-group"> <span class="input-group-addon">日程內容：</span> <label id='agenda-content' class="form-control"></label> </div> <div class="input-group"> <span class="input-group-addon">提交人員：</span> <label id='agenda-user' class="form-control"></label> </div> <div class="input-group"> <span class="input-group-addon">開始時間：</span> <label id='agenda-start' class="form-control"></label> </div> </div></div>2.3.12 droppable
boolean類型，默認為false,表示是否允許從外部拖拽一個事件放到日歷中，設置為true表示允許，回調函數為drop。
使用從外部拖拽時間到日歷中的功能需要JQUERYUIdraggables支持，即需要引入JQUERYUI的js文件。
2.3.13drop拖拽一個外部事件到日歷中時的回調函數；
首先需要存在外部事件才可以進行拖拽，在顯示日歷頁面時，查詢事件表中的所有的事件，傳遞到前臺顯示：
2.3.13.1 顯示日歷頁面顯示日歷頁面時，將事件表中的事件查出，發送到前臺
public String execute() { List<Events> eventList = eventDAO.findAll(); List<User> userList = userDAO.findAll(); List<Level> levelList = levelDAO.findAll(); HttpSession session = request.getSession(); session.setAttribute("eventArr", eventList); session.setAttribute("userArr", userList); session.setAttribute("levelArr", levelList); return SUCCESS; }前臺顯示：
<div class="input-group input-group-sm"> <input type="text" id="event-title" class="form-control" placeholder="增加相關事件.."> <span class="input-group-btn"> <button type="button" id="add-event" class="btn btn-success"> 增加 <i class="glyphicon glyphicon-plus"></i> </button> </span> </div> <div class="divide-30"></div> <fieldset id='external-events'> <legend>我的任務</legend> <div id="event-box"> <c:forEach var="event" items="${ eventArr }"> <div class='external-event'> <c:out value="${ event.title }"/> </div> </c:forEach> </div> <p> <input id='drop-remove' type='checkbox' class="uniform"/> <label for='drop-remove'>事件添加后刪除</label> </p> </fieldset>數據列表上方有新增按鈕，可以在此頁面上新增事件（事件和日程是不一樣的表，事件表示還沒有插入到日程中去，在日歷控件中顯示的為日程）：
$('#add-event').click(function () { var title = $('#event-title').val(); addEvent(title); });var addEvent = function (title) { if(title.length == 0){ alert("事件名稱不能為空！！！"); return; } var url = "00000"; $.post(url, {'title':title}, function(msg){ if(msg != 1){ alert("事件添加失敗/n" + msg); return; } var html = $('<div class="external-event">' + title + '</div>'); jQuery('#event-box').append(html); initDrag(html); }); };將添加成功后的事件顯示在任務列表中，但是為了完成從外部拖拽事件到日歷中形成日程的需求，還需要對添加的事件以及顯示在該區域的事件進行處理：
var initDrag = function (el) { // create an Event Object var eventObject = { // use the element's text as the event title title: $.trim(el.text()) }; // store the Event Object in the DOM element so we can get it later el.data('eventObject', eventObject); // make the event draggable using jQuery UI el.draggable({ zIndex: 999, revert: true, // will cause the event to go back to its revertDuration: 0 // original position after the drag }); };$('#external-events div.external-event').each(function () { initDrag($(this)); });使用JQUERY的data函數，將事件的id和標題放到eventObject中，當需要的時候，可以使用data("eventObject")取出需要的數據。
2.3.13.2 drop實現// this function is called when something is dropped drop: function(date, allDay) { var $obj = $(this); // retrieve the dropped element's stored Event Object var eventOBJ = $obj.data('eventObject'); var start = $.fullCalendar.formatDate(date,'yyyy-MM-dd HH:mm'); // submit the agenda to the background and save to the database var url = "000000"; $.post(url,{title:eventOBJ.title,date:start,allday:allDay},function(msg){ if(msg != 1){ alert(msg); revertFunc(); } else { // is the "remove after drop" checkbox checked? if ($('#drop-remove').is(':checked')) { // if so, remove the element from the "Draggable Events" list $obj.remove(); } //重新獲取所有事件數據 $("#calendar").fullCalendar("refetchEvents"); } }); },Date:事件拖拽到的位置日期；
allDay:是否是整天事件；
后臺實現：
private String title; private String date; private boolean allday; public String drop() throws IOException { response.setContentType("text/plain"); PrintWriter out = response.getWriter(); boolean success = agendaServ.drop(title, date, allday); if(success){ out.print("1"); } else { out.print("failed"); } out.flush(); out.close(); return null; }service實現：
/** * drag the event outside to the calendar and add it to database * @return */ public boolean drop(String title, String date, boolean allday) { Agenda agenda = new Agenda(title); agenda.setAllDay(allday); agenda.setStart(DateUtil.parse2Date(date, "yyyy-MM-dd HH:mm")); return agendaDAO.save(agenda); }上面基本就是整個的fullcalendar的操作，我把前臺和后臺實現都放上來了，當然還有其他的功能，按照需求查API也是可以做出來的，如果有什么不對的地方歡迎大家指正。
新聞熱點
疑難解答
