Question

我正在使用fullcalendar js。在dayClick函数中，我绑定了一个bootstrap popover。它工作正常。但我想在点击的特定日期禁用弹出框。

$('#calendar').fullCalendar({
header: {
left: 'prev',
center: 'title',
right: 'next'
},
defaultDate: '2015-02-12',
editable: true,
eventLimit: true, // allow "more" link when too many events
businessHours: true,
selectable: true,
selectHelper: true,

dayClick: function(event,element,start, end, allDay, jsEvent, view) {  



$(this).popover({
html: true,
placement: 'right',
title: function() {
return $("#popover-head").html();
},
content: function() {
return $("#popover-content").html();
},
html: true,
container: '#calendar'
});
$(this).popover('toggle');


var eventData;
eventData = {
title: title,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
//$('#calendar').fullCalendar('unselect');

if(event.id='unavailable'){
$(this).popover('disable');
}
},




events: [



{
id: 150,
title: 'Conference',
start: '2015-02-09',
status : 'Production',
editurl :'http://yahoo.com',
createurl : 'http://google.com',
},

{
id: 151,
title: 'Lunch',
start: '2015-02-09',

status : 'Approved',
editurl :'http://yahoo.com',
createurl : 'http://google.com',
},

{
id   : 152,
title: 'Dinner',
start: '2015-02-11',
status : 'Exported',
editurl :'http://yahoo.com',
createurl : 'http://google.com',
},
{
id   : 153,
title: 'Birthday Party',
start: '2015-02-13',
status : 'Idea',
editurl :'http://yahoo.com',
createurl : 'http://google.com',
},
{
id: 154,
title: 'New Event',
start: '2015-02-20',
status : 'Recurring',
editurl :'http://yahoo.com',
createurl : 'http://google.com',
},
{ 
id: 155,
title: 'Repeating Event',
start: '2015-02-22',
status : 'Idea',
editurl :'http://yahoo.com',
createurl : 'http://google.com',


},
                                { 
id: 156,
title: 'New Event',
start: '2015-02-22',
status : 'Idea',
editurl :'http://yahoo.com',
createurl : 'http://google.com',


},
// areas where "Meeting" must be dropped
{
id: 'availableForMeeting',
start: '2015-02-12',
end: '2015-02-17',
rendering: 'background',
color:"#7ce51f",

},

// red areas where no events can be dropped
{
start: '2015-02-24',
end: '2015-02-28',

rendering: 'background',
color: '#ff9f89'
},
{
id: 'unavailable',
start: '2015-02-06',

end: '2015-02-08',
overlap: false,
rendering: 'background',
color: '#ff9f89'
}


]
});



$("#calendar").find('.fc-prev-button').children('span').removeClass('fc-icon fc-icon-left-single-arrow').addClass('fa fa-arrow-left'); 
$("#calendar").find('.fc-next-button ').children('span').removeClass('fc-icon fc-icon-right-single-arrow').addClass('fa fa-arrow-right');

请帮忙。

Answer 1

将date添加到您的回叫功能中并做出逻辑以确定该日是否应该或不应该弹出窗口。

 dayClick: function(date, event, view) {
        var placementDate = $(this).data('date');

        var yesNo = "2015-05-13";            //Can do Moment Date logic here if you want to make it nicer

            if(yesNo == placementDate){
                 //Do nothing
            }
            else{
                $(this).popover({
                   html: true,
                   placement: 'right',
                   title: function() {
                   return $("#popover-head").html();
                   },
                   content: function() {
                   return $("#popover-content").html();
                   },
                   html: true,
                   container: '#calendar'
                   });
                   $(this).popover('toggle');
            }

 }

在特定日期禁用bootstrap popover单击fullcalendar js

1 个答案: