jQuery的FullCalendar使用MVC和JSON [英] jquery FullCalendar using MVC and JSON

查看:901
本文介绍了jQuery的FullCalendar使用MVC和JSON的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我只是试图做一些事情很简单,刚开始时。

I'm just trying to do something very simple to start off with.

我使用jQuery FullCalendar在这里找到: http://fullcalendar.io/

I'm using the jQuery FullCalendar found here: http://fullcalendar.io/

当我添加事件数据作为数组(如文档实例提供),历填充。然而,当我尝试做通过jQuery我得到一个有效的JSON响应,但事件不填充。

When I add the event data as an array (as the documentation example provides), the calendar populates. However, when I try to do it via jQuery I get a valid JSON response, but the event doesn't populate.

    $(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电话得到的回应是:

The response I get from my GetCalendarData call is the following:

{"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与此日历的例子。

I've seen others on Stack have similar issues, but I don't see an example on how to use AJAX and JSON with this calendar.

我也试过用eventSources:文档/例子具有相同的结果。

I've also tried to use the eventSources: documentation/example with the same results.

更新:

我更新了基于不同的事情,我已经尽我code。仍然没有运气。我看了看日期格式。我试过系统生成日期,但我见过的一切似乎都指向基于字符串的日期(这是我在更新code已经试过)。不幸的是仍然没有(至少对我来说)工作。

I updated my code based off of different things I've tried. Still with no luck. I've looked at the date formats. I've tried system generated dates but everything I've seen seems to point to string based dates (which is what I've tried in my updated code). Unfortunately that still doesn't work (at least for me).

尽管如此寻求帮助。

推荐答案

答案是在函数的参数。一旦这些被放在再填充日历中的数据

The answer is in the function parameters. Once those are put in then the data populated in the calendar.

    $(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);
                    } 
                }); 
            }

        });
    });

这篇关于jQuery的FullCalendar使用MVC和JSON的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆