Use jquery to implement the school calendar (asp.net + jqueryui1.72) _ jquery

The school calendar has the following features: 1. display the week of the current semester; 2. display the event of today; 3. display the date of the event. Click the date to display the event of the current day. :

Controller code:
Code

The Code is as follows:

Public ActionResult CalendarDisplay ()
{
BL. DateEventBL de = new BL. DateEventBL ();
// Obtain the date of the current day and convert it to the date format using javascript.
DateTimeFormatInfo myDTFI = new CultureInfo ("en-US", false). DateTimeFormat;
String utcTime = DateTime. Now. ToString ("MMM dd, yyyy HH: mm: ss", myDTFI );
ViewData ["currentDay"] = utcTime;
// Obtain the date of the event in the current month
List DateHaveEvent = de. GetTimeHaveEvent (DateTime. Now. Year, DateTime. Now. Month );
List Dates = dateHaveEvent. Select (u => u. ToString ("MMM dd, yyyy HH: mm: ss", myDTFI). ToList ();
ViewData ["datesHaveEvent"] = dates;
// Obtain the event of the current day
List DeInfos = de. GetDE (DateTime. Now, new Guid ("00000000-0000-0000-0000-000000000001 "));
// Obtain the current week
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 (local view ):
Code

The Code is as follows:

<% @ Control Language = "C #" Inherits = "System. Web. Mvc. ViewUserControl > "%>
<% String json = ""; List DatesHaveEvent = ViewData ["datesHaveEvent"] as List ; %>
<%
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) +" \ "}"; // The last item
}
Else
{
Json + = "{\" time \ ": \" "+ datesHaveEvent. ElementAt (I) + "\"},";//
}
}
Json + = "]";
}
%>

Current week <% = ViewData ["currentWeek"] %>


<% = DateTime. Now. tow.datestring () %>


<%
Foreach (var item in Model)
{
%>
<% = Html. Encode (item. Content) %>
<%
}
%>

Javascript (SCRIPT ):
Code

The Code is as follows:

/// Current time conversion between the server and client
Var a = '<% = ViewData ["currentDay"] %> ';
Var B = Date. parse ();
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 ();
/// Obtain the date list
Var jsn = eval ('<% = json %> ');
$ (Function (){
Var options = {
PrevText: "last March January", // prompt text for redirecting TO THE PREVIOUS PAGE
NextText: 'August 11', // The prompt text to jump to the next page.
MinDate:-30,
MaxDate: 30,
HideIfNoPrevNext: false,
DefaultDate: "+" + yearOffset + "y +" + monthOffset + "m +" + dayOffset + "d ",
BeforeShowDay: DisplayDayHaveEvent, // display the operation before each date
OnSelect: select // select a date callback function
};
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 ("http://www.jb51.net/Calendar/EventDetail? Date = "+ dateText );
Return false;
}
// Initialize the date Control
$ ('# DatePicker'). datepicker (options );
})