Bootstrap Backdrop在FullCalendar上删除元素后覆盖了模态



重现问题的方法:
当我将拖动元素(从FullCalendar的外部)拖到FullCalendar,然后启动Bootstrap Modal时,Modal-BackDrop 覆盖了模态。相反,当我不将可滴管元素放到日历上时,模态是可见的,而模态backdrop 没有覆盖模态

其他信息:
当我拖动和删除Fullcalendar内部的元素时,引导模态效果很好。

我确定的东西:

  1. bootstrap模式位于<body></body>标签之间。

fullcalendar初始化:

$('#calendar').fullCalendar({
locale:'pl',
header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
},
views: {
    month: { 
        editable: false,
        droppable: false,
    }
},
slotDuration: '00:15:00',
droppable: true,
defaultDate: date,
defaultView: viewName,
editable: true,
timeFormat:'H(:mm)',
minTime: "07:00:00",
maxTime: "18:00:00",
allDaySlot: false,
events: eventsArray,
eventRender: function(event, element) {
    element.find(".fc-event-title").remove();
    element.find(".fc-event-time").remove();
    element.find(".fc-time").remove();
    var new_description =   
            moment(event.start).format("HH:mm") + '-'
            + moment(event.end).format("HH:mm")
    ;
    element.append(new_description);
},
dayRender: function (date, cell) {
    var date = moment(date).format("YYYY-MM-DD");
    for(var i in holidays) {
        if(date === holidays[i].date) {
            cell.css("background-color", "#FFCBCB");
        }
    }   
},
});

模态初始化:

var modal = $('#addElementModal');
modal.modal();

我已经找到了这种情况的解决方案:

我已经添加到<div class="modal">...modalcontent...</div>以下属性:

data-backdrop="false" style="background-color: rgba(0, 0, 0, 0.5);"

只是删除模态背景并添加其自己的背景。

相关内容

  • 没有找到相关文章

最新更新