下面是一个.NET webForm的具体列子
注意引用了artDialog 以及异步请求数据的json格式字符串
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>无标题页</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <link href=\'fullcalendar/fullcalendar.css\' rel=\'stylesheet\' /> <link href=\'fullcalendar/fullcalendar.print.css\' rel=\'stylesheet\' media=\'print\' /> <script type="text/javascript" src=\'fullcalendar/lib/jquery-1.10.2.min.js\'></script> <script type="text/javascript" src=\'fullcalendar/lib/jquery-ui.custom.min.js\'></script> <script type="text/javascript" src=\'fullcalendar/fullcalendar.min.js\'></script> <script type="text/javascript" src="artDialog/artDialog.source.js?skin=default"></script> <script type="text/javascript" src="artDialog/plugins/iframeTools.source.js"></script> <script src="urlParams.js" type ="text/javascript"></script> <script type="text/javascript"> var newdate;//定义一个时间 var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); var calendar = $(\'#calendar\').fullCalendar({ header: { left: \'prev,next today\', center: \'title\', //不显示则为空 right: \'month,agendaWeek,agendaDay\' }, monthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], monthNamesShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], dayNames: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], dayNamesShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"], today: ["今天"], firstDay: 1, buttonText: { today: \'今天\', month: \'月\', week: \'周\', day: \'日\' }, editable: false, timeFormat: \'HH:mm\', axisFormat: \'HH:mm\', viewDisplay: function(view) { newdate=$.fullCalendar.formatDate(view.start,"yyyy-MM-dd HH:mm:ss"); }, events: function (start, end, callback) { var t1=$.fullCalendar.formatDate(start, "yyyy-MM-dd hh:mm:ss") var t2=$.fullCalendar.formatDate(end, "yyyy-MM-dd hh:mm:ss") $.ajax({ type: "get", async: false, url: "GetDutyAction.ashx?tmp=" + (new Date()).valueOf(), data: { start: t1, end: t2 }, success: function (data) { var date = jQuery.parseJSON(data); //此处虽然allDay有值但是 由于是字符串false 而不是关键字false 默认显示整日 callback(date); <!-- 还有一种加载方式 obj=jQuery.parseJSON(data); for(var i=0;i<obj.length;i++) { var newobj = new Object(); newobj.title=obj[i].title .... $(\'#calendar\').fullCalendar(\'renderEvent\', newobj); //核心的更新代码 } --> } }); }, dayClick: function (date, allDay, jsEvent, view) { var obj = new Object(); art.dialog.open(\'DutyEdit.aspx\', { //duty自由定义只需要设置需要返回值的一些控件 title: \'添加值班\', lock: true, width: 550, height: 340, fixed: true, //固定定位 opacity: 0.6, // 透明度 // 在open()方法中，init会等待iframe加载完毕后执行 init: function () { var iframe = this.iframe.contentWindow; var top = art.dialog.top;// 引用顶层页面window对象 if(date.getDate()==1 ) { iframe.document.getElementById(\'tr_ld\').style.display=""; } var start = iframe.document.getElementById(\'txt_date\'); start.value = $.fullCalendar.formatDate(date, "yyyy-MM-dd"); }, okVal: \'提交值班\', ok: function () { var iframe = this.iframe.contentWindow; if (!iframe.document.body) { alert(\'iframe还没加载完毕呢\'); return false; }; var amuser=iframe.document.getElementById(\'txt_AMUser\').value; var starttime = iframe.document.getElementById(\'txt_date\').value; $.ajax({ type: "get", async: false, url: "SetDutyAction.ashx", data: { user:amuser,start:starttime,type:\'0\'}, success: function (data) { obj=jQuery.parseJSON(data); } }); //此处我是需要插入多条值班信息 if(obj.length>0) { for(var i=0;i<obj.length;i++) { $(\'#calendar\').fullCalendar(\'renderEvent\', obj[i]); //核心的更新代码 } } $(\'#calendar\').fullCalendar(\'unselect\'); art.dialog({ title: \'提醒\', width: 150,// 必须指定一个像素宽度值或者百分比，否则浏览器窗口改变可能导致artDialog收缩 content: \'值班添加至后台！\', icon: \'face-smile\', time: 1 }); return true; }, cancel: true }); }, eventClick: function (calEvent, jsEvent, view) { art.dialog.open(\'DutyEdit.aspx\', { title: \'更新日程\', lock: true, width: 550, height: 340, //background: \'#600\', // 背景色 opacity: 0.6, // 透明度 // 在open()方法中，init会等待iframe加载完毕后执行 init: function () { var iframe = this.iframe.contentWindow; var top = art.dialog.top;// 引用顶层页面window对象 iframe.document.getElementById(\'txt_date\').value=$.fullCalendar.formatDate(calEvent.start, "yyyy-MM-dd"); }, okVal: \'修改值班\', ok: function () { var iframe = this.iframe.contentWindow; if (!iframe.document.body) { alert(\'iframe还没加载完毕呢\') return false; }; calEvent.dutyuser=iframe.document.getElementById(\'txt_User\').value ; calEvent.title="上午值班："+calEvent.dutyuser; calEvent.dutyUid=iframe.document.getElementById(\'Hidden1\').value if (calEvent.dutyuser == \'\') { alert("人员不能为空"); return false; } $.ajax({ type: "get", async: false, url: "SetDutyAction.ashx", data: { id:calEvent.id,name:calEvent.dutyuser,userid:calEvent.dutyUid,type:\'1\'}, success: function (data) { } }); $(\'#calendar\').fullCalendar(\'updateEvent\', calEvent); ////弹出提示 art.dialog({ title: \'提醒\', width: 150,// 必须指定一个像素宽度值或者百分比，否则浏览器窗口改变可能导致artDialog收缩 content: \'值班已更新！\', icon: \'face-smile\', time: 1 }); return true; }, cancel: true, //删除日程，保存到数据库 button: [{ name: \'删除日程\', callback: function () { $.ajax({ type: "get", async: false, url: "SetDutyAction.ashx", //.net ajax异步请求删除数据库数据 data: { id:calEvent.id,type:\'2\'}, success: function (data) { } }); $(\'#calendar\').fullCalendar(\'removeEvents\', calEvent.id); art.dialog({ title: \'提醒\', width: 150,// 必须指定一个像素宽度值或者百分比，否则浏览器窗口改变可能导致artDialog收缩 content: \'值班已删除！\', icon: \'face-smile\', time: 1 }); return true; } }] }); } }); }); </script> <style type="text/css"> body { margin-top: 40px auto; text-align: center; font-size: 14px; font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; } #calendar { width: 900px; margin: 0 auto; } </style> </head> <body> <form id="form1" runat="server"> <div ><span id="title" style="font-size:25px; font-weight:bolder;">值班表</span></div> <div id=\'calendar\'></div> </form> </body> </html>
DataSet ds = db.ExecuteDataSet(dbcom); if (ds.Tables[0].Rows.Count > 0) { DateTime start1 = DateTime.Parse(dr["StartDate"].ToString()); DateTime end1 = DateTime.Parse(dr["EndDate"].ToString()); result += "{\"id\":\"" + dr["ID"].ToString() + "\",\"title\":\"" + title + "\",\"dutyuser\":\"" + dr["DutyUser"].ToString() + "\",\"dutyUid\":\"" + dr["DutyUserID"].ToString() + "\","; result += "\"start\":\"" + start1.ToString("yyyy-MM-dd hh:mm:ss") + "\",\"end\":\"" + end1.ToString("yyyy-MM-dd hh:mm:ss") + "\",\"status\":\"" + dr["Status"].ToString() + "\",\"allDay\":\"false\"" + color + "},"; } result = result.TrimEnd(\',\') + "]"; }