views:

516

answers:

4

hello everybody. I am new to fullCalendar and i do not kno how to use gotoDate method. What i have is a tabbed page with 12 tabs (every tab is a month of the year). What i need is when i load jquery calendar, foreach tab, the calendar to switch to the month that is assigned. (e.g when i click and load page for January the calendar shows days for january, and so on).

thanks for your help.

A: 

Have you read the API? It seems that if you want to show July 2010 you call:

yourCal.fullCalendar('gotoDate',2010,6);

My answer is simple because I have no idea what you've already tried to do.

Jeremy
A: 

Did you check out the documentation page? The function takes in 2 required parameters and 2 optional ones.

.fullCalendar( 'gotoDate', year [, month, [ date  ]] )

So to set your calendar to April 2010, you would use something like this:

.fullCalendar( 'gotoDate', 2010, 5)

Note that the months are 0-based so April=5.

Peter Jacoby
I think that April would be the 3, not 5. 0-base means that the value is decreased by one.
Teddy
Ah, great point, thanks for the correction. I guess my example was for June instead.
Peter Jacoby
+1  A: 

DEMO: http://jsbin.com/avofu3

$(function() {

    var date = new Date();

  $('#mothlist li > a').click(function(e) { 

    e.preventDefault();

    var d = date.getDate();
    var y = date.getFullYear();
    var m = $(this).attr('id');

    $('#calendar').fadeOut(200).empty().fullCalendar({month: m , day: d, year: y }).fadeIn(200);

  });

});

HTML:

<ul id="mothlist"> 
          <li><a id="12" href="#">December</a></li> 
          <li><a id="11" href="#">November</a></li> 
          <li><a id="10" href="#">October</a></li> 
          <li><a id="9" href="#">September</a></li> 
          <li><a id="8" href="#">August</a></li> 
          <li><a id="7" href="#">July</a></li> 
          <li><a id="6" href="#">June</a></li> 
          <li><a id="5" href="#">May</a></li> 
          <li><a id="4" href="#">April</a></li> 
          <li><a id="3" href="#">March</a></li> 
          <li><a id="2" href="#">February</a></li> 
          <li><a id="1" href="#">January</a></li> 
        </ul> 

<div id='calendar'></div> 
aSeptik
A: 

hello all again. Yes ive read the API and the documentation page and ive tried your solutions initially but doesn`t work as should because i also needed the another methods to run. What i have done and it is working for me now is that i declared year: 2010 and month: (whatever i needed).

Thanks all for your sugestions and specially to aSeptik. Nice demo. i will consider it. Have a good day all and thanks again for your time.

madrat