爲什麼fullcalendar不渲染模態內，但沒有

Question

有人可以告訴我爲什麼日曆不顯示在模態？但沒有模態，他們確實顯示得很好。 看到這個第一它的工作原理：Fiddle 看到這個地方並不：Fiddle

我想我需要使用fullCalendar('render');但即便如此，代碼似乎沒有工作的權利點擊功能裏面。請協助。

Answer 1

它看起來fullCalendar不會呈現，如果它的任何父母有display: none;。 The render method you referenced只是您需要使用的內容，但您需要在之後僅顯示模型。

或者你也可以嘗試一些離開模型display: block;，但放置在屏幕外（left: -1000%; right: 1000%;或類似的），直到你想它可見。

Answer 2

這是我做的，使它在你的模態版本工作。 我創建了一個函數，您可以將日曆添加到模式中，並在單擊「標記假期」按鈕時調用它。

$('#vacaBtn').click(function() { 
     modal.style.display = "block"; 
     renderCalendars(); 
}); 

我把創建三個日曆的renderCalendars（）函數中，使他們獲得加入模態模態顯示出來之後的所有代碼。

function renderCalendars() { 
    $('#calendar0').fullCalendar({ 
    header: { 
      left: '', 
      center: 'title', 
      right: '' 
     }, 
     defaultDate: moment(y+"-"+(m+1)+"-"+d), 
     theme: true, 
     dayClick: function(date, jsEvent, view) { 

     alert('Clicked on: ' + date.format()); 

    } 
    }); 

    $('#calendar1').fullCalendar({ 
    header: { 
      left: '', 
      center: 'title', 
      right: '' 
     }, 
     defaultDate: moment(y+"-"+(m+2)+"-"+d), 

    theme: true 
    }); 
    $('#calendar2').fullCalendar({ 
     header: { 
      left: '', 
      center: 'title', 
      right: '' 
     }, 
      theme: true, 
     defaultDate: moment(y+"-"+(m+3)+"-"+d) 
    }); 
}