Question

我在使用事件填充jQuery FullCalendar时遇到了很多麻烦。

浏览器：IE8

Tech：MVC 3 Razor

正在使用的脚本：jquery-1.5.1，fullcalendar.js

控制器和支持方法:(尽管我的问题是它从未首先出现在这里）

     public JsonResult GetCalendarData()
    {
        List<CourseSection> courseSecs = //genarates list of course sections from db context
        var listOfEvents = new List<object>();

        foreach (CourseSection courseSec in courseSecs)
        {
            Course course = db.Course.Find(courseSec.CourseID);
            listOfEvents.Add(
            new
            {
                id = courseSec.ID,
                title = course.Name + "Section " + courseSec.Name,
                start = ToUnixTimespan(courseSec.sectionBeginDateAndDailyStartTime),
                end = ToUnixTimespan(courseSec.sectionEndDateAndDailyEndTime),
                allDay = false //none of the course sections run all day
            });
        }

        return Json(listOfEvents.ToArray(), JsonRequestBehavior.AllowGet);

    }
    private string ToUnixTimespan(DateTime date) //supporting method
    {
        TimeSpan tspan = date.ToUniversalTime().Subtract(
        new DateTime(1970, 1, 1, 0, 0, 0));

        return Math.Truncate(tspan.TotalSeconds).ToString();
    }

查看：

    @model Web.Models.Registration

     @{
     ViewBag.Title = "ViewSchedule";
     Layout = "~/Views/Shared/_SiteLayout.cshtml";
     }

     <script>
     $(document).ready(function () {
     // page is now ready, initialize the calendar...
     $('#calendar').fullCalendar({
              defaultView: "agendaWeek",
              year: 2013,
              month: 0,
              date: 25,
              minTime: 6,
              maxTime: 18,
              aspectRatio: 1.5,
              allDaySlot: false,
              events: "/Course/GetCalandarData"
              });
     });
     </script>


     <div class="wrapper col3">
       <div id="container">
         <h1>View Schedule</h1>
           <div id = 'calendar'>
           </div>
        <br />
        @Html.ActionLink("Home", "Home", "Static")
        <br />
       </div>
     </div>

问题：日历本身和所有配置加载正常。但是，最后一行配置（事件：“/ Course / GetCalendarData”）不会触发。期。它永远不会访问我在控制器方法中放置的任何调试块，也不会返回任何JSON。

我尝试在访问网址中添加必须的“@ Url.Content ...”前缀。我试过在不同的控制器中安装该方法。我尝试过使用不同版本的jQuery。我删除了可能导致冲突的所有无关脚本。全部都是为了nada。

我一直在撕扯我的头发。有什么想法吗？

Answer 1

经过几个小时的调试后，我发现了一种解决方法。

我修改了控制器代码并将其移动到一个单独的静态类，而不是从视图中启动JSON请求到GetCalendarData方法。然后我使用它返回一个普通的对象数组，然后在视图中动态地将数组转换为JSON。观察：

控制器和支持方法：

    public static object[] GetCalendarData()
    {
    List<CourseSection> courseSecs = //list of course sections from db context
    var listOfEvents = new List<object>();

        foreach (CourseSection courseSec in courseSecs)
        {
            Course course = db.Course.Find(courseSec.CourseID);
            listOfEvents.Add(
                new
                {
                    id = courseSec.ID,
                    title = course.Name + "Section " + courseSec.Name,
                    start = ToUnixTimespan(courseSec.sectionBeginDateAndDailyStartTime),
                    end = ToUnixTimespan(courseSec.sectionEndDateAndDailyEndTime),
                    allDay = false
                });
        }

        return listOfEvents.ToArray();

    }

    public static string ToUnixTimespan(DateTime date)
    {
        TimeSpan tspan = date.ToUniversalTime().Subtract(
     new DateTime(1970, 1, 1, 0, 0, 0));

        return Math.Truncate(tspan.TotalSeconds).ToString();
    }

查看： @model Web.Models.Registration

    @{  
        ViewBag.Title = "ViewSchedule";
        Layout = "~/Views/Shared/_SiteLayout.cshtml";
    }

    @{
        object[] events = Web.Extensions.CourseOps.GetCalendarData();
    }

    <script>
        $(document).ready(function () {
            var allSections = @Html.Raw(Json.Encode(events));
            // page is now ready, initialize the calendar...
            $('#calendar').fullCalendar({
        defaultView: "agendaWeek",
        year: 2013,
        month: 0,
        date: 25,
        minTime: 6,
        maxTime: 18,
        aspectRatio: 1.5,
        allDaySlot: false,
        events: allSections,
        // put your options and callbacks here
    });

        });
    </script>


    <div class="wrapper col3">
      <div id="container">
        <h1>View Schedule</h1>
        <div id = 'calendar'>
        </div>
         <br />
        @Html.ActionLink("Home", "Home", "Static")
        <br />
      </div>
    </div>

我的原始javascript配置（事件：＆＃34; / Course / GetCalendarData＆＃34;）未触发的事实可能归因于我在控制器上的授权属性，或者我检查的相当激进的方式经过验证的饼干，但是那种进入杂草的方式。

关键是，我找到了一个成功的解决方法，我很满意。

特别感谢＆＃34; charlietfl＆＃34;坚持与我并尽力帮助。

直到下次......

Fullcalendar事件填充问题：javascript不会触发

1 个答案: