【问题标题】:Map JSON return to be FullCalendar jQuery library useable?Map JSON 返回到 FullCalendar jQuery 库可用?
【发布时间】:2013-11-08 00:04:52
【问题描述】:

FullCalendar jQuery 库 (http://arshaw.com/fullcalendar/) 满足了我的需求。它似乎正好有我需要的东西。但是我不知道如何配置它以使用这个现有的 JSON 服务返回:

{
    "SystemResponse": null,
    "Events": 
    {        
        "systemMessageField": "",
        "otherMessageField": "",
        "eventsField": 
        [
            {
                "additionalTextField": "",
                "eventTitle": "eventTitle1",
                "eventCommentsField": "",
                "eventDateTimeField": "/Date(1379953200000-0500)/",
                "eventDateTimeFieldSpecified": true,
                "eventEndDateTimeField": "/Date(1379954400000-0500)/",
                "eventSourceIDField": "2",
                "eventSourceNumberField": "",
                "eventTimeZoneField": "CDT",
                "eventTypeField": "9109"
            },
            {
                "additionalTextField": "Add Text",
                "eventTitle": "eventTitle1",
                "eventCommentsField": "",
                "eventDateTimeField": "/Date(1379975400000-0500)/",
                "eventDateTimeFieldSpecified": true,
                "eventEndDateTimeField": "/Date(1379979000000-0500)/",
                "eventSourceIDField": "3",
                "eventSourceNumberField": "",
                "eventTimeZoneField": "CDT",
                "eventTypeField": "U123"
            }
        ]
    }
}

我相信该服务应该返回类似于“理想”的 FullCalendar Return:

[
    "0",
    {
        "allDay": "",
        "title": "Test event",
        "id": "821",
        "end": "2011-06-06 14:00:00",
        "start": "2011-06-06 06:00:00"
    },
    "1",
    {
        "allDay": "",
        "title": "Test event 2",
        "id": "822",
        "end": "2011-06-10 21:00:00",
        "start": "2011-06-10 16:00:00"
    }
]

有没有办法利用 FullCalendar 功能来获取我的原始源 json 并像这样映射:

eventDateTimeField->开始
eventEndDateTimeField->结束
eventTitle->标题

那么 FullCalendar 控件应该可以使用我原来的事件服务来创建事件(哦,解析那些讨厌的 json 日期......)

【问题讨论】:

  • 根据我的经验,我正在处理 fullcalendar 和 JSON,FC 不接受复杂的 JSON,但只接受简单的对象 {"id":"0","start":"2013-10-31" ,"end":null}...您必须将 JSON 过滤为基本的示意图 JSON,然后将其发送到 fullcalendar...另请注意,日期必须采用 FC 接受的格式,例如 ---> 2013-10- 31 00:00:00
  • 是的。我相信你是对的。我需要编写一个修改后的网络服务来使用完整的日历。
  • 如果您需要进一步解释,请告诉我,祝您好运。

标签: javascript json fullcalendar


【解决方案1】:

您的想法是正确的,将 JSON 提要的结果映射到 FullCalendar 的事件对象属性。

必须确保 allDay 是一个布尔值,这意味着您返回 true 或 false,不带引号(使用您的浏览器确保它显示 "allDay":true 或 "allDay": truefalse! 周围没有任何引号的 false)。要么,要么根本不返回它,让你的默认值适用于所有事件(不是很实用)。

标准化一种日期格式也很有用,我发现 UNIX 日期/时间格式是 FullCalendar 和数据库后端之间最可靠的通信方式。但是,请注意您希望在几秒钟内完成此操作(这些天是 10 位数字)。从您的示例中,我可以看到它以毫秒为单位。您需要除以 1,000 或将其视为字符串并取最左边的 10 个字符。我建议您将数据存储在 UTC 中,并在数据库之外进行任何时区操作。此操作将应用于检索存储日期。

如果您无法更改现有 JSON 提要中的编码,则可以创建一个中间“侦听器”来从当前提要中检索数据并对其进行操作(确保 allDay 实际上是一个布尔值并反映事件的状态,重新格式化日期/时间数据并翻译元素名称)。然后,您的 FullCalendar 事件似乎来自您的中介通过查询现有 JSON 提要创建的 JSON 提要。

FullCalendar 存储所有属性,无论它是否使用它们,这样您仍然可以根据提要中可用的增强数据来操作事件对象,尽管 FullCalendar 的正确操作只需要少数属性。

【讨论】:

    猜你喜欢
    • 2017-03-30
    • 2015-01-18
    • 2010-10-28
    • 2015-08-12
    • 2010-09-27
    • 2014-04-26
    • 1970-01-01
    • 2011-01-27
    • 1970-01-01
    相关资源
    最近更新 更多