Progredux
Progredux

Reputation: 41

JQuery FullCalendar not rendering events on initial view

I'm doing a basic FullCalendar. When the calendar is first rendered its blank even though there are events in that month. If I go to the next month then return to the current month the events are displayed and all other months that have events display properly when you land on those months. A similar question was asked last year but was not answered with a solution that works.

I'm opening the calendar in a new window. Below is the relevant calendar html and js code. If I put the calendar on the main page it opens correctly. This problem only occurs when I open a new window and put the calendar in it.

//from calendar.html
<!DOCTYPE html>
<html>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript" src="fullcalendar.js"></script>
    <link href="fullcalendar.css" rel="stylesheet">
  </head>
  <body>
    <script src="calendar-script.js" type="text/javascript"></script>
    <div id="calendar"></div>
  </body>
</html>

//from calendar-script.js
(function() {
  $(document).ready(function($) {
    //code to get the event data and generate the eventsArray
    $('#calendar').fullCalendar({
      events: eventsArray
    });
  });
})();

Upvotes: 3

Views: 1341

Answers (1)

Progredux
Progredux

Reputation: 41

This code is part of my first Javascript/JQuery project and I apparently forgot what the A in Ajax stands for. I'm using an Ajax call to get the data and had the call to the calendar outside of the Ajax success function. Putting the calendar function at the end of the Ajax success function solved the problem.

Upvotes: 1

Related Questions