Search code examples
javascriptjqueryfullcalendarfullcalendar-scheduler

Pass datepicker's date parameter to get resources in FullCalendar


My current calendar looks like this :

full-calendar design

What I'm trying to do is change calendar date when I click a date in datepicker ( which is already done using .fullCalendar('gotoDate',date ) ) , the thing is , to get the resources and events I need to re-send the query to the server with the new value of 'date' , otherwise the calendar won't reload the data.

Here's the url I'm using to get the resources :

resources: 
            {

                url: '/general?handler=AllResources', 
                data: function () { 
                    return {
                        // must return the new date to display in calendar
                    };

                }
            }

'AllResources' method only get a few records depending on the date specificied as parameter.

BTW : I'm rendering fullCalendar in document.ready , then I have the following function to give my datepicker the 'changeDate' functionality :

$('.fc-center h2').datepicker({
                format: "dd/mm/yyyy",
                language: "es",
                dateFormat: "dd/mm/yyyy",
                todayHighlight: true

            }).on("changeDate", function (e) {


                var date = moment(e.date);

                $("#calendar").fullCalendar('gotoDate', date);




            });

Solution

  • Im not sure if i unserstand your problem.

    So if you change the date, the resources don't get updated? Have a look at refetchResourcesOnNavigate

    [edit] Try this:

    $('.fc-center h2').datepicker({
                    format: "dd/mm/yyyy",
                    language: "es",
                    dateFormat: "dd/mm/yyyy",
                    todayHighlight: true
    
                }).change(function (e) {
                 var mydate =moment($(this).val(),'DD/MM/YYYY').format('YYYY-MM-DD');
    
           $("#calendar").fullCalendar('gotoDate', mydate);
    
    });
    

    And then when initializing the calender set 'refetchResourcesOnNavigate: true' to make sure whenever the calendar changes the resources get loaded again