隐藏日历中的FullCalendar

Question

I Have a fullCalendar, with dynamic data that is loaded with a external json file to be rendered in a hidden div(a div inside a modal). After document ready, i'll load FC using:

$("#calendar").fullCalendar({
    lazyFetching: false,
    defaultDate: '$hoje',
    events: 'events.json'
});

When i open the modal, i just have "Today" and navigation buttons - without any data. Only after clicking on "Today" button that my calendar is rendered. Is there anything that i've forgotten?

The JSON File:

[{
    "title": "Title",
    "color": "#3c8dbc",
    "start": "2016-10-17"
}, {
    "title": "Title",
    "color": "#3c8dbc",
    "start": "2016-10-18"
}]

Answer 1

After searching for a reason, i've found that due calendar is hidden, the "render" does not worked properly.

To fix it, i've added a function on modal open callback:

$("#myModal").on('show.bs.modal',function(){
    setTimeout(function(){$("#calendar").fullCalendar('render')}, 300);
});