我的活动现在会出现吗? - Jquery完整日历

时间:2011-04-19 21:25:05

标签: jquery asp.net-mvc asp.net-mvc-3 fullcalendar

我正在使用asp.net mvc 3和jquery 1.5.2与jquery完整日历1.5.1

我有这个

$('#calendar').fullCalendar ({
    theme: true,
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    editable: false,
    eventSources:[{
        url: '/Home/GetCurrentMonth',
        type: 'Get',
        color: 'yellow',   // a non-ajax option
        textColor: 'black' // a non-ajax option
    }]
});

它关闭并且确实击中我的JsonResult方法并返回类似这样的内容

[{"id":9,"title":"test4","start":"4/1/2011 5:00:00 AM","end":"4/1/2011 6:30:00 AM","allDay":false},
{"id":9,"title":"test4","start":"5/1/2011 12:00:00 PM","end":"5/1/2011 1:30:00 PM","allDay":false}]

然而没有任何表现。我做错了什么?

List<CalendarAppointment> appointments = 
    calendarService.GetAppointment("test@hotmail.com", start, end);

List<CalendarEventViewModel> vm = Mapper.Map<List<CalendarAppointment>,
    List<CalendarEventViewModel>>(appointments);

return Json(vm, JsonRequestBehavior.AllowGet);

这就是GetCurrentMonth。

public class CalendarEventViewModel
{
    public int id { get; set; }
    public string title { get; set; }
    public string start { get; set; }
    public string end { get; set; }
    public bool allDay { get; set; }
}

那是我的ViewModel。

2 个答案:

答案 0 :(得分:1)

以下对我有用:

控制器:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult GetCurrentMonth()
    {
        var vm = new[]
        {
            new CalendarEventViewModel
            {
                id = 1,
                title = "title 1",
                start = "start 1",
                end = "end 1",
                allDay = false
            },
            new CalendarEventViewModel
            {
                id = 2,
                title = "title 2",
                start = "start 2",
                end = "end 2",
                allDay = true
            },
        };
        return Json(vm, JsonRequestBehavior.AllowGet);
    }
}

查看:

<script src="@Url.Content("~/fullcalendar-1.5.1/fullcalendar/fullcalendar.min.js")" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $('#calendar').fullCalendar({
            theme: true,
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            editable: false,
            eventSources: [{
                url: '@Url.Action("GetCurrentMonth", "Home")',
                type: 'GET',
                color: 'yellow',   // a non-ajax option
                textColor: 'black' // a non-ajax option
            }]
        });
    });
</script>

<div id="calendar"></div>

不确定您的代码有什么问题。我发现您没有将fullCalendar调用包装在$(document).ready处理程序中,因此在您尝试将日历附加到#calendar元素时,可能尚未加载DOM。 / p>

答案 1 :(得分:0)

问题在于jquery validate 1.7影响它。不知道为什么只有当json结果出现时它才会影响它,但这就是问题所在。