Jquery绑定数组数据



类别:

public class Event
    {
        public Guid EventID { get { return new Guid(); } }
        public string EventName { get; set; }
        public string StartDate { get; set; }
        public string EndDate { get; set; }
        public int ImageType { get; set; }
        public string Url { get; set; }
    }

CaseCalendar.aspx。cs

[WebMethod]
public static IList GetEvents()
{
 IList events = new List<Event>();
 for (int i = 0; i < DateTime.DaysInMonth(DateTime.Now.Year, DateTime.Now.Month); i++)
 {
 events.Add(new Event
 {
 EventName = "My Event " + i.ToString(),
 StartDate = DateTime.Now.AddDays(i).ToString("MM-dd-yyyy"),
 EndDate = DateTime.Now.AddDays(1).ToString("MM-dd-yyyy"),
 ImageType = i % 2,
 Url = @"http://www.test.com"
 });
 }
 return events;
}

Jquery:

 <script type='text/javascript'>
 $(document).ready(function () {
$.ajax({
type: "POST",
contentType: "application/json",
data: "{}",
url: "CaseCalendar.aspx/GetEvents",
dataType: "json",
success: function (data) {
          $('#calendar').fullCalendar({
          editable: true,
          lang: 'tr',
          events: [
          {
           title: 'All Day Event',
           start: new Date(y, m, 1)
          },
          {
           title: 'Long Event',
           start: new Date(y, m, d - 5),
           end: new Date(y, m, d - 2)
          },
          {
           id: 999,
           title: 'Repeating Event',
           start: new Date(y, m, d - 3, 16, 0),
           allDay: false
           },
           {
            id: 999,
            title: 'Repeating Event',
            start: new Date(y, m, d + 4, 16, 0),
            allDay: false
           },
           {
           title: 'Meeting',
           start: new Date(y, m, d, 10, 30),
           allDay: false
           },
           {
           title: 'Lunch',
           start: new Date(y, m, d, 12, 0),
           end: new Date(y, m, d, 14, 0),
           allDay: false
           },
           {
          title: 'Birthday Party',
          start: new Date(y, m, d + 1, 19, 0),
          end: new Date(y, m, d + 1, 22, 30),
          allDay: false
         },
         {
         title: 'Click for Google',
         start: new Date(y, m, 28),
         end: new Date(y, m, 29),
         url: 'http://google.com/'
        }
       ]
    });

 });

我正在尝试将数据从方法绑定到事件。

根据我的例子,我如何将GetEvents方法中的数据绑定到事件(在jquery中)。我正试图绑定如下,但它对我不起作用。

  $('#calendar').fullCalendar({
                        editable: true,
                        lang: 'tr',
                        events: data;
 });

任何帮助都将不胜感激。

谢谢。

您需要添加moment.js,这在此处可能是必要的

$('#calendar').fullCalendar({
                            editable: true,
                            lang: 'tr',
                            events: $.map(data, function (item, i) {
                                 var event = new Object();
                                 event.title = item.EventName;
                                 event.start = moment(item.StartDate).utc();
                                 event.end = moment(item.EndDate).utc();
                                 //Add others
                                 return event;
                            });
});

由于我以前遇到过这个问题,我问了这个问题,并能够自己解决这个问题

最新更新