如何日期选择器和fullcalendar

Question

之间的链接如何日期选择器和fullcalendar

Answer 1

之间的链接，也许这将有助于：

$('#id_datepicker').datepicker({ 
    'onSelect': function(){ 
    $('#calendar').fullCalendar('gotoDate',$('#id_datepicker').datepicker('getDate')); 
} 

Answer 2

这是我如何做到这一点，它当前工作。 gotoDate的工作方式是它会在你所在的视图中执行一个日期。它不会为你切换视图，所以如果你想让日期选择器将你带到所选日期的日视图，你必须切换视图首先调用fullCalendar的gotoDate函数。这是您需要的唯一两个功能。您可能需要更改switchView功能的参数，具体取决于您要切换到的视图。

我也从交换视图调用了一个loadevents（）函数，所以我必须在我的视图上更新事件，然后多次调用一个不同的函数。函数调用是我写的AddEventSourceDetailed（）;

这是你需要从jquery datepicker中选择一个日期，在日视图中去那个特定的日子，并加载你想要的事件。

$('#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 
    }); 
}