One thing that is essential in having a calendar for a web application is the capability to have a go to date that will enable a user to go directly and display a specific date. On the FullCalendar plugin, I made use of the gotoDate method. It is not complicated, you just have to create a form that will ask a user to input the desired date to view, and a javascript function that will trigger the gotoDate method.

Note: I advise you to read my previous post ( CakePHP and jQuery FullCalendar plugin (Part I – Retrieve events from database)) first regarding this plugin.

Add this to your index page where the calendar is displayed. (ie. app/views/calendar/index.ctp)


<script type='text/javascript'>


function gotodate(userdate){
  
var dateinput = new Date(userdate); // userdate is what the user has inputted.

$('#calendar')
     	.fullCalendar('changeView', 'basicDay')  // we called the changeView method to display basicDay view.
     	.fullCalendar('gotoDate', dateinput);  // here's where we call the gotoDate method to do the magic.

}

</script>

Hope this helps! If you have any suggestions or corrections feel free to do so :) By the way, you could also check out Part I – Retrieve from database and Part II – Editable feature :)

About these ads