Question

我正在尝试使用jQuery完整日历，因此我必须为从数据库获取的结果动态设置事件，因此我使用数据属性来设置值，然后将其显示在日历中。这是我的html树枝：

 {%  for i in suivilabo %}
 <div id="calendar" class="loopindex" data-index={{ loop.index }} 
 data-date="{{ i.futuredate|date('Y-m-d') }}</div>
 {%  endfor %}

这是我的js代码：

$(document).ready(function () {


$('#calendar').fullCalendar({
    defaultDate: new Date(),
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    events: [

$('.loopindex').each(function() {

    {title:'INR laboratoire',start:$('.loopindex').data('date'), allDay: true},
});


    ]
});


}

）;

Answer 1

您现在在做什么没有任何意义，您假设$('.loopindex').each(function() {将返回一个有效的对象并将该对象打印/传递到数组events，这与交易无关（并且甚至在语法上也不正确）

您需要做的是在启动日历之前创建一个数组，例如

var dates = [];
$('div[data-date]').each(function() {
    dates.push({title:'INR laboratoire',start: $(this).data('date'), allDay: true});
});

然后您可以将这个新数组传递给日历的event属性，例如

$('#calendar').fullCalendar({
    defaultDate: new Date(),
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    events: dates,
});

Answer 2

只需将id更改为class

<div class="calendar loopindex"  ...

然后

$('.calendar').fullCalendar({

jQuery完整日历使用循环动态添加事件

2 个答案: