JavaScript事件日历未在IE中显示事件(在Chrome中工作)

时间:2017-04-12 15:26:32

标签: jquery json internet-explorer events fullcalendar

我正在使用https://fullcalendar.io/的JavaScript事件日历。它在Chrome上工作正常,但在IE(11版)中没有显示事件。 Json从Web方法返回,但事件未显示在页面上。

[WebMethod]
public static List<Event> GetEvents()
{
    List<Event> events = new List<Event>();
    for (int i = 0; i < dt.Rows.Count; i++)
    {
        Event ev = new Event();

        ev.EventID = Convert.ToInt32(dt.Rows[i]["EventID"]);
        ev.EventName = dt.Rows[i]["EventName"].ToString();
        ev.StartDate = dt.Rows[i]["StartDate"].ToString();
        ev.EndDate = dt.Rows[i]["EndDate"].ToString();

        if (String.IsNullOrEmpty(dt.Rows[i]["Location"].ToString()))
        {
            ev.Location = "--";
        }
        else
        {
            ev.Location = dt.Rows[i]["Location"].ToString();
        }
        ev.Description = dt.Rows[i]["Description"].ToString();
        events.Add(ev);
    }
    return events;
}




<script type="text/javascript">
  jQuery(document).ready(function () {
    $.ajax({
        type: "POST",
        contentType: "application/json",
        data: "{}",
        url: '<%= ResolveUrl("EventList.aspx/GetEvents")%>',
        dataType: "json",
        success: function (data) {
            $('#fullcal').fullCalendar({
                eventClick: function (calEvent, jsEvent, view) {
                    $('#eid').html(calEvent.id);
                    $('#modalTitle').html(calEvent.title);
                    $('#msDate').html(moment(calEvent.start).format('DD-MM-YYYY HH:mm'));
                    $('#meDate').html(moment(calEvent.end).format('DD-MM-YYYY HH:mm'));
                    $('#mloc').html(calEvent.loc)
                    $('#mdesc').html(calEvent.des)        
                     $('#url').attr('href', 'Meetings/Meeting.aspx?ID=' + calEvent.id)                 
                    $('#fullCalModal').modal();

                },

                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,basicWeek,basicDay'
                },
                views: {
                    month: { // name of view

                        columnFormat: 'dddd',

                    },


                    week: { // name of view
                        titleFormat: 'MMMM  D , YYYY',
                        columnFormat: 'dddd D/M',

                    },
                    day: { // name of view
                        titleFormat: 'MMMM  DD  YYYY',
                        columnFormat: 'dddd D-M-YYYY',
                        // other view-specific options here
                        //displayEventEnd: true,
                        // timeFormat: 'H:mm'
                    }
                },

                //editable: true,
                displayEventTime: false,// hide event time 
                eventLimit: true, // allow "more" link when too many events
                events: $.map(data.d, function (item, i) {
                    var event = new Object();
                    event.id = item.EventID;
                    event.title = item.EventName;
                    event.start = new Date(item.StartDate);
                    event.end = new Date(item.EndDate);
                    event.loc = item.Location;
                    event.des = item.Description;
                    return event;
                }),

            });

            $("div[id=fullcal]").show();

        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            debugger;
        }
    });
});


</script>
         <div id="modalBody" class="modal-body">
            <table id ="t1" class="table">
            <thead>
              <tr>
                <th><b>Start Date</b></th>
                <th><b>End Date</b></th>
                <th><b>Location</b></th>
              </tr>
            </thead>
                <tbody>
                  <tr>
                    <td id ="msDate"></td>
                    <td id ="meDate"></td>
                    <td id ="mloc"></td>
                  </tr>
                </tbody>
             </table>
             <table id ="t2" class="table">
            <thead>
              <tr>
                <th><b>Description :</b></th>
              </tr>
            </thead>
                <tbody>
                  <tr>
                    <td id ="mdesc"></td>
                  </tr>
                </tbody>
             </table>
          </div>

0 个答案:

没有答案