Bootstrap 来自全日历事件点击的模态调用

Question

我的页面上有一个完整的日历。在它上面我有一个添加事件按钮。这会调用一个 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']);
}

当我单击该事件时，我会收到正在运行的警报 link，但我从未收到模态弹出窗口。

编辑：

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

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

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

Answer 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');

请注意，我尚未测试此代码。

更多信息：http://getbootstrap.com/javascript/#modals-methods

Bootstrap 来自全日历事件点击的模态调用

Bootstrap modal call from fullcalendar event click

javascript

php

fullcalendar

twitter-bootstrap