Loading multiple Fullcalendars in jquery tabs fails - loads all in 1st tab

I am attem开发者_运维技巧pting to do two things:

1. Create multiple instances of a Fullcalendar displaying different event sources - this seems to be working when stacked on a page.

2. I need each Fullcalendar instance to appear within a different jquery tab. I have the tabbing code correct and working but for some reason all calendars are loaded within the 1st tab even though I am specifying each Fullcalendar to be on separate tab.

Ideas?

I'm using something similar to the code below. Works fine with jquery ui tabs. I'm using JSON for my event sources but you can add whatever event source you need etc.

$('#tabs').tabs({
  show: function() {
    $('#calendar1').fullCalendar('render');
    $('#calendar2').fullCalendar('render');
  }
});

$('#calendar1').fullCalendar({
  eventSources: [
    "json_events1.php"
  ]
});

$('#calendar2').fullCalendar({
  eventSources: [
    "json_events2.php"
  ]
});