数据之 events（json） – FullCalendar 中文文档

FullCalendar 中文文档目录

返回 json 格式数据的接口，每当 FullCalendar 需要的数据的时候就会访问这个地址（例如用户在当前视图前进或者后退，或者切换视图），FullCalendar 会判断需要的时间段，并且把这个时间放在 get 请求参数中。参数的命名由 startParam 和 endParam 选项决定（默认 start 和 end），参数的值总是 UNIX 时间戳（从 1970 年开始的时间戳）。

$('#calendar').fullCalendar({
  events: '/myfeed.php',
})

对于上面的代码，FullCalendar 会访问如下地址：

/myfeed.php?start=1262332800&end=1265011200&_=1263178646

_参数是自动生成的，防止接口缓存数据。跨域请求使用 JSONP。

1.5 版本之后，可以使用 Event Source options，如下：

$('#calendar').fullCalendar({
  eventSources: [
    // your event source
    {
      url: '/myfeed.php', // use the `url` property
      color: 'yellow', // an option!
      textColor: 'black', // an option!
    },

    // any other sources...
  ],
})

常用的 Event Source 设置可以查看这里。但是对于 json 数据源，还有以下两个属性：

字段	说明
startParam	设置此 Event Source 下的 startParam
endParam	设置此 Event Source 下的 endParam

JQuery $.ajax#

你可以使用任何的 JQuer ajax 属性在 eventSource 对象中：

$('#calendar').fullCalendar({
  eventSources: [
    // your event source
    {
      url: '/myfeed.php',
      type: 'POST',
      data: {
        custom_param1: 'something',
        custom_param2: 'somethingelse',
      },
      error: function () {
        alert('there was an error while fetching events!')
      },
      color: 'yellow', // a non-ajax option
      textColor: 'black', // a non-ajax option
    },

    // any other sources...
  ],
})

上面是例子用单一 event 的写法是：

$('#calendar').fullCalendar({
  events: {
    url: '/myfeed.php',
    type: 'POST',
    data: {
      custom_param1: 'something',
      custom_param2: 'somethingelse',
    },
    error: function () {
      alert('there was an error while fetching events!')
    },
    color: 'yellow', // a non-ajax option
    textColor: 'black', // a non-ajax option
  },
})

动态 data 属性#

通过 GET 或者 POST 发送出去的 data 属性，可以通过函数动态的设置：

$('#calendar').fullCalendar({
  events: {
    url: '/myfeed.php',
    data: function () {
      // a function that returns an object
      return {
        dynamic_value: Math.random(),
      }
    },
  },
})

startParam 和 endParam 依然会自动添加。

缓存#

默认的，会有个_参数来防止缓存的影响。FullCalendar 通过设置 $.ajax 来实现这一点。如果你不想这么用，可以把 cache 设置为 true：

$('#calendar').fullCalendar({
  events: {
    url: '/myfeed.php',
    cache: true,
  },
})

官方英文文档：http://arshaw.com/fullcalendar/docs/event_data/events_array/