如何动态设置 Fullcalendar 选项答案

【问题标题】：How can I set Fullcalendar options dynamically如何动态设置 Fullcalendar 选项
【发布时间】：2012-11-06 02:07:59
【问题描述】：

创建日历后如何设置minTime 和maxTime 选项？

我尝试了以下方法，但不起作用：

$('#calendar').fullCalendar('option', 'minTime', 7);
$('#calendar').fullCalendar('render');

【问题讨论】：

不知道FC能不能用不同的选项重新初始化；在我的应用程序中，我只是在更改 min/maxTime 后执行 window.location.reload()...

标签： jquery-plugins fullcalendar

【解决方案1】：

如果不重新创建日历，则无法完成。

更新： 可以在 v 2.9 中完成：请参阅 below

【讨论】：

【解决方案2】：

此功能已在v2.9.0正式发布：http://fullcalendar.io/docs/utilities/dynamic_options/

【讨论】：

【解决方案3】：

这样您就可以更改任意数量的日历选项：

// save the calendar options in a variable
var calendarOptions = $('#calendar')
     .fullCalendar('getView')
     .options;

// make your changes to the calendar options
// I wanted to change the slotDuration
calendarOptions.slotDuration = '00:20:00';

// destroy the calendar
$('#calendar')
     .fullCalendar('destroy');

//Lets load the calendar with the new options
$('#calendar')
     .fullCalendar(calendarOptions);

希望这会有所帮助。谢谢。

【讨论】：

这是最好的答案。谢谢
@DuyHoang 请在这里查看我的答案：stackoverflow.com/a/39360621/4742733。看来FullCalendar v3已经出局了，这里的回答更有效率。
我想在更改日期后更改 minTime 和 maxTime（使用 next、back、today... 按钮）我可以放置代码$('#cc-calendar') .fullCalendar('option','minTime','00:10:00'); 的最佳位置是什么？
@DuyHoang 你将不得不使用callback function >> viewRender(callback) >> fullcalendar.io/docs/display/viewRender。因此，当您单击next,back,today 按钮后视图为rendered 时，将调用此函数，您可以在该函数中执行您的代码行。

【解决方案4】：

just me dud's answer 实际上是我找到自己的唯一方法。

这只是前一个答案的补充：如果您想更改可编辑选项，如果您想在更新数据库之前锁定事件以要求确认更改，这非常有用，这有点棘手。如果它可以为我转储代码的人节省一些时间：

var view = $('#calendar').fullCalendar('getView');
view.calendar.options.editable = false;
view.calendar.overrides.editable = false;
view.calendar.viewSpecCache.month.options.editable = false;
view.calendar.viewSpecCache.agendaWeek.options.editable = false;
view.calendar.viewSpecCache.agendaDay.options.editable = false;
$('#calendar').fullCalendar('render');

您显然将所有这些 false 更改为 true 以解锁。

【讨论】：

【解决方案5】：

我不知道它是否仍然相关，但我可以使用以下语句更改选项：

可选示例：

$('#calendar').fullCalendar('getView').calendar.options.selectable = false;
$('#calendar').fullCalendar('render'); // rerender to see visual changes

虽然它不是动态的，但至少您不必销毁整个日历并重新获取您的事件:-)

【讨论】：

非常感谢，这个解决方法很棒。它也适用于 fullcalendar v2，我只想补充一点，以使选项更改生效，调用：$('#calendar').fullCalendar('render');
这方面的文档在哪里？

【解决方案6】：

这段代码对我来说很好。在任何地方调用这个函数并向它传递尽可能多的自定义变量，但不要忘记先销毁之前的日历

function initializeCalendar( timeIntervalCustom ) {
  $('#calendar'+id).fullCalendar({
  slotMinutes: timeIntervalCustom,

});                       

}

$('#calendar').fullCalendar("destroy");
initializeCalendar(10);

【讨论】：

【解决方案7】：

此功能存在一个未解决的问题：

https://code.google.com/p/fullcalendar/issues/detail?id=293

【讨论】：