jquery FullCalendar使用MVC和JSON

我只是想做一些非常簡單的事情開始。jquery FullCalendar使用MVC和JSON

我使用了jQuery FullCalendar發現這裏：http://fullcalendar.io/

當添加所述事件數據作爲陣列（如文檔的示例提供），日曆填充。但是，當我嘗試通過jQuery來做到這一點時，我得到了一個有效的JSON響應，但事件沒有填充。

$(document).ready(function() { 
     // page is now ready, initialize the calendar... 
     $('#calendar').fullCalendar({ 
      events: { 
       url: '../calendar/GetCalendarData', 
       type: 'GET', 
       data: {}, 
       success: function (doc) { 
         //alert(doc.title + ' ' + doc.start); 
         var events = []; 
         events.push(doc); 
         alert(events[0].title + ' ' + events[0].start); 
       }, 
       error: function() { 
        alert('there was an error while fetching events!'); 
       }, 

       color: 'yellow', // a non-ajax option 
       textColor: 'black' // a non-ajax option 
      } 
     }); 
     // Code and Documents: http://fullcalendar.io/ 
    }); 


    [HttpPost] 
    public ActionResult PostCalendarData() 
    { 
     return Json(new { title = "Free Pizza", allday = "false", borderColor = "#5173DA", color = "#99ABEA", textColor = "#000000", description = "<p>This is just a fake description for the Free Pizza.</p><p>Nothing to see!</p>", start = "2015-01-04T22:00:49", end = "2015-01-01", url = "http=//www.mikesmithdev.com/blog/worst-job-titles-in-internet-and-info-tech/" }); 
    } 

    [HttpGet] 
    public ActionResult GetCalendarData() 
    { 
     return Json(new { title = "Free Pizza", allday = "false", borderColor = "#5173DA", color = "#99ABEA", textColor = "#000000", description = "<p>This is just a fake description for the Free Pizza.</p><p>Nothing to see!</p>", start = "2015-01-04T22:00:49", end = "2015-01-01", url = "http=//www.mikesmithdev.com/blog/worst-job-titles-in-internet-and-info-tech/" }, JsonRequestBehavior.AllowGet); 
    }

我從我的GetCalendarData電話得到的迴應是：對堆棧

{"title":"Free Pizza","allday":"false","borderColor":"#5173DA","color":"#99ABEA","textColor":"#000000","description":"\u003cp\u003eThis is just a fake description for the Free Pizza.\u003c/p\u003e\u003cp\u003eNothing to see!\u003c/p\u003e","start":"2015-01-04T22:00:49","end":"2015-01-01","url":"http=//www.mikesmithdev.com/blog/worst-job-titles-in-internet-and-info-tech/"}

我看到別人也有類似的問題，但我沒有看到關於如何使用AJAX的例子和這個日曆的JSON。

我也嘗試使用eventSources：文檔/示例具有相同的結果。

更新：

我更新了我的代碼，基於我試過的不同事情。仍然沒有運氣。我看過日期格式。我試過了系統生成的日期，但是我所看到的一切似乎都指向了基於字符串的日期（這是我在更新的代碼中嘗試過的）。不幸的是，這仍然不起作用（至少對我而言）。

仍在尋求幫助。

來源

2015-01-04 webdad3

您的後端'Datetime'格式在javascript中無效 – charlietfl 2015-01-04 15:41:47

@charlietfl - 這樣做的正確方法是什麼？ – webdad3 2015-01-04 15:52:35

從服務器發送正確的格式 – charlietfl 2015-01-04 15:53:09

答案在函數參數中。一旦這些數據填入日曆中填充的數據中。

$(document).ready(function() { 
     var events = []; 
     $('#calendar').fullCalendar({ 
      events: function(start, end, timezone, callback) { 
       $.ajax({ 
        url: source, 
        type: 'POST', 
        data: { }, 
        success: function (doc) { 
         events.push(doc); 
         callback(events); 
        } 
       }); 
      } 

     }); 
    });

來源

2015-01-04 18:03:27 user3263194

我不知道這是否仍然是您的問題，但我確實設法使它適用於我。我幾乎有一個確切的案例。這是我的例子：

[HttpGet] 
public JsonResult SerializeEvent(int id) 
{ 
    var sesh = Umbraco.TypedContent(id).Descendants("courseSession"); 
      var eventList = new List<EventModel>(); 
      foreach (var item in sesh) 
      { 
       var eventObj = new EventModel(); 
       eventObj.start = item.GetPropertyValue<DateTime>("startDate").ToString("yyyy-MM-dd"); 
       eventObj.end = item.GetPropertyValue<DateTime>("endDate").ToString("yyyy-MM-dd"); 
       eventObj.title = item.Parent.Name; 
       eventObj.url = item.Parent.Url; 

       eventList.Add(eventObj); 
      }   

      return Json(eventList, JsonRequestBehavior.AllowGet); 
}

做出什麼區別，我從ActionResult改變方法的返回類型JsonResult，並且還加入了第二個參數「JsonRequestBehavior.AllowGet」到返回的功能。

希望這會有所幫助。

來源

2016-07-21 16:54:47 Borjan

jquery FullCalendar使用MVC和JSON

回答

相關問題