Asp.Net利用Ajax实现Fullcalendar动态获取更新events并修改日程单元格背景颜色
先上效果图
我就不对Fullcalendar做过多阐述了,直接进入正题
1.先说说数据填充 后台aspx.cs代码
后台获得数据后把要展示的数据拼接成一个json数组传回页面,就是Fullcalendar中的events数据源
拼接字符串完整代码:“{\"url\":\"javascript:aClick(1," + dt.Rows[i]["test_id"] + "," + dt1.Rows[i]["class_id"] + ")\",\"className\":\"aaa\",\"title\":\"" + dt.Rows[i]["test_name"].ToString() + "\",\"start\":\"" + DateTime.Parse(dt.Rows[i]["test_date"].ToString()).ToString("yyyy-MM-dd") + "\"}”
aspx页面代码:
页面使用的是ajax获取,这里的data就是后台拼接的df,data编译之后就获得了我们的events数据源,完成页面数据填充
2.给日程单元格加上背景颜色
这里同样是运用js代码实现的,大概思路:获取月视图所有td标签,进行循环,当该单元格的时间与数据源的start匹配时,给其添加背景颜色。
3.更新events数据源
后记:讲解的不是很详尽,希望在这里能够帮到大家。大家有什么疑问可以留言,博主一定精心解答。