Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Integrate Small Calendar (datepicker) and Timeline with fullCalendar

I want to implement two features apart from the ones in Basic View of FullCalendar. The inspiration is Google calendar. Here is what I want:

http://i42.tinypic.com/1ffm7k.png

Although I couldn't find these two features in FullCalendar documentation I'd still like to confirm if FullCalendar supports these features. If not, please feel free to share any suggestions on how I should implement them.

like image 410
Adil Malik Avatar asked Oct 08 '22 17:10

Adil Malik


1 Answers

You can accomplish the time line with the code here, and you can use date picker and link it with fullcalendar to create the small calendar on the left. Here is how to implement it...

$(document).ready(function() {
    $('#datepicker').datepicker({
        inline: true,
        onSelect: function(dateText, inst) {
            var d = new Date(dateText);
            $('#calendar').fullCalendar('gotoDate', d);
        }
    }); 
}

This will force fullCalendar to go to what ever date is selected in the jquery date picker.

like image 133
Juan Gonzales Avatar answered Oct 12 '22 12:10

Juan Gonzales