来自全日历事件单击的引导模式调用答案

【问题标题】：Bootstrap modal call from fullcalendar event click来自全日历事件单击的引导模式调用
【发布时间】：2015-08-27 16:29:14
【问题描述】：

我的页面上有一个完整的日历。在它上面我有一个添加事件按钮。这会调用一个 javascript 函数，该函数会打开一个允许用户添加事件的模式视图。

function showAddMeeting() {
    var current_date = $('#calendar').fullCalendar('getDate');
    $("#modal").load('modal.php?type=meeting&action=add&date='+current_date);
}

这非常有效。现在，我还有另一个编辑会议的功能：

function showEditMeeting(meeting_id) {
    alert('modal.php?type=meeting&action=edit&id='+meeting_id);
    $("#modal").load('modal.php?type=meeting&action=edit&id='+meeting_id);
}

当我把它放在按钮上时，它工作正常。但是当我将它作为函数添加到事件中时，它不起作用。

eventClick: function(event) {
    showEditMeeting(event['id']);
}

当我单击事件时，我会收到工作链接的警报，但我从未收到模式弹出框。

编辑：

我发现这是因为我没有打电话

 data-toggle="modal" data-target="#modal"

有人知道如何通过 javascript 调用它吗？

【问题讨论】：

标签： javascript php twitter-bootstrap fullcalendar

【解决方案1】：

Bootstrap 在“modal.js”中包含所有可用于模态的方法，这包含在压缩包中。

你需要按如下方式使用它。

原创

function showEditMeeting(meeting_id) {
    alert('modal.php?type=meeting&action=edit&id='+meeting_id);
    $("#modal").load('modal.php?type=meeting&action=edit&id='+meeting_id);
}

变成

function showEditMeeting(meeting_id) {
    alert('modal.php?type=meeting&action=edit&id='+meeting_id);
    $("#modal").load('modal.php?type=meeting&action=edit&id='+meeting_id).modal('show');
}

注意额外的 .modal('show');

请注意，我没有测试过这段代码。

【讨论】：