FullCalendar - 是否可以更改/添加文本?

时间:2016-02-12 14:10:16

标签: javascript jquery fullcalendar

是否可以动态更改/添加文字或每天的任何内容,如下图所示?

每天用调试器检查后都有其他css名称。

fullCalendar.io

enter image description here

2 个答案:

答案 0 :(得分:1)

我确实相信我的一位同事几天前使用dayRender来达到这个目的。

这样的东西可能有用,但它是未经测试的代码。

dayRender: function (date, cell) {
    cell.text(moment(date).format('DD'));
}

我们正在使用moment.js库格式化单元格上的日期。

答案 1 :(得分:0)

这是我使用的,它有点复杂,但你可能会找到你想要做的。 它使用JS函数快速更改提供给FullCallendar的事件列表和JS钩子,以便在特定事件上添加html标记(Glyphicon)。

  // JSON of all events
var allEvents = <?php echo $json; ?>;

  // set the fullCalendar
$('#calendar').fullCalendar({

  header: {
    left: '',
    center: 'title',
    right: 'prev,next today'
  },
  weekends:false,
  fixedWeekCount:false,
    // our own JS function to filter the event
  events: function(start, end, timezone, callback) {
    var filteredEvents = [];
    var noDuplicateAssignment = [];
      // we walk on every event to filter every duplicate
    $.each(
      allEvents,
      function (key, oneEvent) {
          // we just display allUnique
        if (noDuplicateAssignment.indexOf(oneEvent.id) < 0) {
          filteredEvents.push(oneEvent);
          noDuplicateAssignment.push(oneEvent.id);
        }
      }
    );
      // we supply our events to the fullCalendar callback
    callback(filteredEvents);
  },
    // hook to add the glyphicon on electronic==TRUE event
  eventRender: function (event, element) {
    if(event.electronic)
      element.find('.fc-content').prepend(
        '<i class="glyphicon glyphicon-envelope"></i> '
        );
  }
});

如果您正在谈论内容,最好是为您的数据使用JSON格式的输入。

使用Json,您可以编辑JavaScript Json对象并调用此新对象的呈现以获得所需内容。 http://fullcalendar.io/docs/event_data/events_array/