用jquery实现学校的校历(asp.net+jquery ui 1.72)

截图:

controller代码：
代码

public ActionResult CalendarDisplay() 
{ 
BL.DateEventBL de = new BL.DateEventBL(); 
//获取当日日期,使用能被javascript转换成日期的格式 
DateTimeFormatInfo myDTFI = new CultureInfo("en-US", false).DateTimeFormat; 
string utcTime = DateTime.Now.ToString("MMM dd,yyyy HH:mm:ss", myDTFI); 
ViewData["currentDay"] = utcTime; 
//获取当月有事件的日期 
List<DateTime> dateHaveEvent = de.GetTimeHaveEvent(DateTime.Now.Year, DateTime.Now.Month); 
List<String> dates=dateHaveEvent.Select(u=>u.ToString("MMM dd,yyyy HH:mm:ss", myDTFI)).ToList(); 
ViewData["datesHaveEvent"] = dates; 
//获取当日事件 
List<BL.CDateEvent> deInfos = de.GetDE(DateTime.Now, new Guid("00000000-0000-0000-0000-000000000001")); 
//获取当前周 
BL.DateSpanBL ds = new BL.DateSpanBL(); 
int currentWeek = ds.GetCurrentWeek(DateTime.Now, new Guid("00000000-0000-0000-0000-000000000002")); 
ViewData["currentWeek"] = currentWeek; 
return View(deInfos); 
}

partialview(局部视图)：
代码

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<BL.CDateEvent>>" %> 
<%string json = ""; List<String> datesHaveEvent = ViewData["datesHaveEvent"] as List<String>; %> 
<% 
if (datesHaveEvent != null && datesHaveEvent.Count > 0) 
{ 
json = "["; 
for (int i = 0; i < datesHaveEvent.Count;i++) 
{ 
if (i == datesHaveEvent.Count - 1) 
{ 
json += "{\"time\":\"" + datesHaveEvent.ElementAt(i) + "\"}"; // 最后一项 
} 
else 
{ 
json += "{\"time\":\"" + datesHaveEvent.ElementAt(i) + "\"},"; // 
} 
} 
json += "]"; 
} 
%> 
<div id="datePicker"></div> 
<br /> 
当前是第 <span style="color:Red; font-size:14px;"><%=ViewData["currentWeek"]%> </span> 周 
<br /> 
<%=DateTime.Now.ToShortDateString() %> 
<br /> 
<% 
foreach(var item in Model) 
{ 
%> 
<%=Html.Encode(item.Content) %> 
<% 
} 
%> 
<br /> 
<div id="otherEvent" style=" width:300px;"></div>

javascript(脚本):
代码

///服务器与客户端当前时间的转换 
var a='<%= ViewData["currentDay"]%>'; 
var b = Date.parse(a); 
var serviceDate = new Date(b); 
var clientDate = new Date(); 
var yearOffset = serviceDate.getYear() - clientDate.getYear(); 
var monthOffset = serviceDate.getMonth() - clientDate.getMonth(); 
var dayOffset = serviceDate.getDate() - clientDate.getDate(); 
///获取日期列表 
var jsn = eval('<%=json %>'); 
$(function() { 
var options = { 
prevText: "上一月", //跳转到上一页的提示文本 
nextText: '下一月', //跳转到下一页的提示文本 
minDate: -30, 
maxDate: 30, 
hideIfNoPrevNext: false, 
defaultDate: "+" + yearOffset + "y +" + monthOffset + "m +" + dayOffset + "d", 
beforeShowDay: DisplayDayHaveEvent, //显示每个日期之前的操作 
onSelect: select // 选择一个日期的回调函数 
}; 
function DisplayDayHaveEvent(date) { 
for (var i = 0; i < jsn.length; i++) { 
var cc = Date.parse(jsn[i].time); 
var time = new Date(cc); 
if (date.getMonth() == time.getMonth() && date.getDate() == time.getDate()) { 
return [true, ""] 
} 
} 
return [false, ""]; 
} 
function select(dateText, inst) { 
$('#otherEvent').load("https://3water.com/Calendar/EventDetail?date=" + dateText); 
return false; 
} 
//初始化日期控件 
$('#datePicker').datepicker(options); 
})