dayClick上的FullCalendar打开引导模式

时间:2015-03-16 08:45:22

标签: twitter-bootstrap fullcalendar

当用户点击fullCalendar中的某一天时,我想打开一个引导模式。我查看了dayClick事件,但无法弄清楚如何调用该模型。

dayClick: function(date, jsEvent, view) {
     // call the model 
},

调用bootstrap模型的正常链接

<a href="#" data-toggle="modal" data-target="#myModal"..................../>

编辑:

我只使用1个引导程序模型来满足我的所有需求,只需更改内容即可。我这样做的方法是调用一个href ..所以我的链接看起来像:

<a href="<?php echo site_url('model/add') ?>" data-toggle="modal" data-target="#myModal" role="button" class="btn-u btn-block"> Add</a>

4 个答案:

答案 0 :(得分:13)

如果其他人需要在bootstrap模型中打开fullCalendar事件,我找到了这样做的方法:

添加:

        eventClick:  function(event, jsEvent, view) {
            $('#modalTitle').html(event.title);
            $('#modalBody').html(event.description);
            $('#eventUrl').attr('href',event.url);
            $('#calendarModal').modal();
        },

模特:

<div id="calendarModal" class="modal fade">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span> <span class="sr-only">close</span></button>
            <h4 id="modalTitle" class="modal-title"></h4>
        </div>
        <div id="modalBody" class="modal-body"> </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>
</div>
</div>

答案 1 :(得分:5)

以下内容应该有效:

dayClick: function(date, jsEvent, view) {
    $("#myModal").modal("show");
},

假设你的模态的ID实际上是myModal.modal()是bootstrap用来操作模态的JavaScript方法...同样,你可以使用$("#myModal").modal("hide")来关闭模态......

答案 2 :(得分:1)

另一种方法是在日历上重新编制:

eventRender: function(event, element) {
                        element.attr('data-toggle', "modal");
                        element.attr('data-target', "#sched-modal");
                        element.attr('href', "/details");
                    }

答案 3 :(得分:0)

我有同样的问题,但出于某种原因,只有'文字'方法适合我。

SaveAsync()