完整日历上的多个事件选择

Question

刚开始使用完整的日历，它很棒。 非常容易遵循文档，并且非常满意。 通过 json 显示了一个漂亮的时间线视图。

我已经在谷歌上搜索了一段时间，可以这么说，这是一种能够点击日历中的事件并将其放入购物篮的方法。

这样，您可以单击日历中的许多事件，然后同时对它们执行操作。 我有一个项目确实可以从此功能中受益。

有谁知道这是否已经存在，或者是否有人以某种方式实现这一目标？ 也许通过控制单击事件或简单地单击每个事件并将其添加到最近单击的事件列表中？

谢谢

Answer 1

我想我会发布我对这个问题的解决方案。 感谢@ADyson为我指出正确的方向。

因此，首先，您需要在页面上添加一个开关，如果设置为"开"，则会更改"完整日历的OnClick"的默认行为。

<label>
<input type="checkbox" name="bulkSelect" id="bulkSelect" data-toggle="toggle">
Bulk Select
</label>

接下来，在完整日历调用之前，在脚本标记中添加以下代码行。 一个空白数组和两个函数。 一个用于添加到阵列，一个用于从阵列中删除。

var myEvents = [];
function addToEventArray(element)
{
myEvents.push(element);
}
function removeAFromArray(arr)
{
var what, a = arguments, L = a.length, ax;
while (L > 1 && arr.length)
{
what = a[--L];
while ((ax= arr.indexOf(what)) !== -1)
{
arr.splice(ax, 1);
}
}
return arr;
}

现在，对于事件，请单击完整日历。 事件单击仅检查批量选择是否设置为选中。 如果是这样，则您单击的每个新事件都将添加到所选事件的数组中。 它还会在所选事件周围放置红色边框。 如果再次单击该事件，则会从数组中删除该事件并删除边框。

请注意，我正在使用extendedProps.eventID，这是一个自定义字段，允许我为每个新事件提供自己唯一的ID。

eventClick: function(info) {
if($('#bulkSelect').prop('checked') == true)
{
if(jQuery.inArray(info.event.extendedProps.eventID, myEvents) != -1)
{
removeAFromArray(myEvents, info.event.extendedProps.eventID);
info.el.style.borderColor = 'transparent';
}
else
{
addToEventArray(info.event.extendedProps.eventID);
info.el.style.borderColor = 'red';
}
}
else
{
console.log('clicked single event');
}
}

我希望这对其他人有用。