JQuery не создает содержимое календаря как контейнер скрыть

У меня есть элемент управления calendar и внутренние вкладки, но когда я щелкаю заголовок вкладки, он открывает контейнер, но календарь Jquery внутри него не работает?

подозревая его, потому что контейнер отображается: изначально нет.

Теперь я инициализирую календарь по щелчку моего заголовка вкладки, как показано ниже,

$(".nav-tabs li:nth-child(6)").on("click", function () {
$("#dcr-ordering-calendar").show();
/* initialize the calendar*/
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();

$('#dcr-ordering-calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    editable: true,
    droppable: true, // this allows things to be dropped onto the calendar
    drop: function () {
        // is the "remove after drop" checkbox checked?
        if ($('#drop-remove').is(':checked')) {
            // if so, remove the element from the "Draggable Events" list
            $(this).remove();
        }
    },
    events: [
        {
            title: 'All Day Event',
            start: new Date(y, m, 6),
            color: '#a22a92'
        },
        {
            title: 'Long Event',
            start: new Date(y, m, 8),
            end: new Date(y, m, 10),
            color: '#1aa6b3'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: new Date(y, m, d - 3, 16, 0),
            allDay: false,
            color: '#1aa6b3'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: new Date(y, m, d + 4, 16, 0),
            allDay: false,
            color: '#1aa6b3'
        },
        {
            title: 'Meeting',
            start: new Date(y, m, d, 10, 30),
            allDay: false,
            color: '#85ad20'
        },
        {
            title: 'Lunch',
            start: new Date(y, m, d, 12, 0),
            end: new Date(y, m, d, 14, 0),
            allDay: false,
            color: '#85ad20'
        },
        {
            title: 'Birthday Party',
            start: new Date(y, m, d + 1, 19, 0),
            end: new Date(y, m, d + 1, 22, 30),
            allDay: false,
            color: '#85ad20'
        }
    ]
});

});

как это исправить?

1 ответ

  1. Fullcalendar не отображает скрытые элементы по дизайну.

    Возможно, потребуется вручную вызвать метод render render

    Немедленно заставляет календарь отрисовываться и / или корректировать его размер.

    .fullCalendar( 'render' )

    Этот метод полезен в сценарии, где настройка вкладки может Скрыть / показать календарь.