How to linking between datepicker and fullcalendar
How to linking between 开发者_Python百科 datepicker and fullcalendar
maybe this will help:
$('#id_datepicker').datepicker({
'onSelect': function(){
$('#calendar').fullCalendar('gotoDate',$('#id_datepicker').datepicker( 'getDate' ));
}
This is how I do it and it currently works. The way the gotoDate works is it will do to a date within the view you are in. It will not switch views for you, so if you want the datepicker to take you to the day view of that date picked, you must switch the view first then call the gotoDate function for the fullCalendar. Here are the only two functions you need. You may need to change the parameter for the switchView function depending on what view you want to switch to.
I also call a loadevents() function from the switch view so I have the must up to date events on my view, it then calls a different function multiple times. The function is calls is mine that I wrote AddEventSourceDetailed();
That is most of what you need to choose a date from a the jquery datepicker, go the that specific day in the day view, and load the events you want.
$('#datepicker').datepicker({
onSelect: function (dateText, inst) {
switchView('agendaDay');
$('#calendar').fullCalendar('gotoDate', new Date(dateText));
}
});
function switchView(view) {
$('#calendar').fullCalendar('changeView', view);
loadEvents();
}
function AddEventSourceDetailed(act_id) {
$('#calendar').fullCalendar('addEventSource', function (start, end, callback) {
$.ajax({
type: 'POST',
url: '/Employee/GetScheduleDetailedArray/',
async: true,
dataType: "json",
data: {
// our hypothetical feed requires UNIX timestamps
start: Math.round(start.getTime() / 1000),
end: Math.round(end.getTime() / 1000),
id: '@Model.selectedUserId',
act: act_id
},
success: function (doc) {
callback(doc);
},
error: function (xhr, status, error) {
document.appendChild(xhr.responseText);
}
}); //end ajax
});
}
精彩评论