Fullcalendar 2.5 eventSource网址会错误地格式化开始日期和结束日期

时间:2015-12-11 21:48:48

标签: c# angularjs fullcalendar momentjs

所以我在AngularJS应用程序中将fullcalendar从1x升级到2x的过程中遇到了一些问题,其中eventSource url需要收集日历事件,附加了开始和结束参数格式为(YYYY-MM-DD)的日期需要在几秒钟内 - 我认为 - 至少那是我们在版本1x中的工作原理。

当我的控制器被实例化时,我要做的第一件事是建立传递给fullcalendar指令所需的eventSources变量(我使用angular fullcalendar包装器指令:http://angular-ui.github.io/ui-calendar/)。

HTML:

<div id="calendar" class="col-sm-9" ng-model="eventSources" calendar="myCalendar" config="uiConfig.calendar" ui-calendar="uiConfig.calendar"></div>

控制器:

$scope.eventSources = [];
for (var i = 0; i < calendars.length; i++) {
    $scope.eventSources[i] = getEventSource(calendars[i]);
}

var getEventSource = function(calendar) {
        return {
            cid: calendar.cal_head_id,
            url: "/api/classroom/student/calendar?ids=" + calendar.cal_head_id,
            className: 'calendar-' + calendar.sort_order,
            backgroundColor: calendar.color_code
        };
    };

但是我的字符串参数不断出现:

ids=2525213&start=2015-11-30&end=2016-01-11&_=1449868998385

最后我的服务器端代码处理请求:

[ActionName("calendar")]
        public JsonArray GetCalendarEvents(string ids, int start, int end)
        {
            var calendars = ids.Split(',');
            var startDate = new DateTime(1970, 1, 1, 0, 0, 0).AddSeconds(start);
            var endDate = new DateTime(1970, 1, 1, 0, 0, 0).AddSeconds(end);

            var data = new CalendarService().GetEvents(calendars, 0, startDate, endDate);

            var events = new JsonArray();
            var results = (JsonArray) data["results"];

            foreach (JsonObject obj in results)
            {
                var name = ((JsonString) obj["name"]).Value;
                if (name == "<b>Homework</b>")
                {
                    name = "<img src=/images/icons/house.png /> Homework";
                }

                var link = ((JsonString) obj["link"]).Value;
                if (!string.IsNullOrEmpty(link) && link.Contains("doEditEvent"))
                {
                    link = "";
                }

                var eventStart = Convert.ToDateTime(obj["start_time"].ToString());
                var eventEnd = Convert.ToDateTime(obj["end_time"].ToString());

                events.Add(new JsonObject
                {
                    {"id", obj["event_id"]},
                    {"calId", obj["calendar_id"]},
                    // Note: Firefox requires the dates are in the below format - JD 6/12/2013
                    {"start", eventStart.ToString("o")},
                    {"end", eventEnd.ToString("o")},
                    {"allDay", eventStart == eventEnd.AddMinutes(1).AddDays(-1)},
                    {"title", name},
                    {"link", link},
                    {"description", obj["description"]}
                });
            }

            return events;
        }

手动添加开始和结束的问题是fullcalendar默认执行此操作,因此它会多次连接params。根据有关从1x升级到2x(http://fullcalendar.io/wiki/Upgrading-to-v2/)的文档,库已更新为使用时刻,这很好,因为我认为这将解决任何格式问题,我肯定已将其包含在我的项目中。

我在这里寻找一个解决方案,不会让我篡改完整的日历源代码,否则我需要回到1x。

1 个答案:

答案 0 :(得分:1)

startParam和endParam从v1更改为v2,从UNIX时间戳更改为ISO8601样式日期字符串。您必须添加包含时间戳的其他参数,hack fullcalendar.js以发送时间戳,重做服务器端代码或使用v1.xx

对于您的服务器端代码,似乎您可以将其更改为

[ActionName("calendar")]
        public JsonArray GetCalendarEvents(string ids, string start, string end)
        {
            var calendars = ids.Split(',');
            var startDate = DateTime.parse(start);
            var endDate = DateTime.parse(end);

如果您想覆盖“开始”&#39;并且&#39;结束&#39;要成为UNIX邮票,这可能有用。

See fiddle here

$('#calendar').fullCalendar({
  /* You can rename the start and end params from 'start' and 'end' */
  /* In this code, 'start', 'end' and 'startDate' and 'endDate' will be on URL */
  startParam: 'startDate',
  endParam: 'endDate',
  eventSources: [{
    url: '/test', /* Set this to whatever is appropriate */
    data: function() {
        var view = $('#calendar').fullCalendar('getView');
      return {
        /* Then you can change 'start' and 'end' in the URL to be UNIX stamps */
        'start': view.start.unix(),
        'end': view.end.unix(),
      };
    },
    /* This is just to demo the URL being queried, not required */
    beforeSend: function () {
        alert(this.url);
    }
  }]
});