如果你打算开发日程表,签到表之类的asp.net网页,那么系统自带的Calendar控件显然是无法满足要求的,如果你有一点jQuery基础,那么一定会寻找一款jQuery插件,本文就是记录fullcalendar怎么用的。
fullcalendar官方网站:http://arshaw.com/fullcalendar/
基础的功能就不说了,本文只说如何动态从数据库里面加载日历项,首先从网站上面下载fullcalendar的源代码,然后写一个handle处理文件,在显示日历的页面里面写上
$(document).ready(function () { var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); $('#calendar').fullCalendar({ editable: false, monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'], monthNamesShort: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'], dayNamesShort: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'], events: "handle.aspx", loading: function(bool) { if (bool) $('#loading').show(); else $('#loading').hide(); }, eventClick: function(event) { // opens events in a popup window window.open(event.url, 'newwindow', 'width=700,height=600'); return false; } }); });
有了这段代码,日历页面加载的时候就会自动加载handle.aspx页面,然后会把当前可以看到的日期以参数的形式发送回去。如handle.aspx?start=1214121541&end=1214121415&_=15464213,最后一个参数是个随机数,以防ajax回传的时候缓存不刷新数据。
可以在handle.aspx里面用如下代码把开始结束日期转换成DateTime,
DateTime dts = (new DateTime(1970, 1, 1)).AddHours(8);//1970-1-1 08:00:00 //加上秒数 DateTime start = dts.AddSeconds(double.Parse(Request.QueryString["start"])); DateTime end = dts.AddSeconds(double.Parse(Request.QueryString["end"]));
每次点击日历上面的上一个月,下一个月按钮就会自动执行handle.aspx页面,无需编写额外代码,非常好用。