fullcalendar- How to bind events dynamically

Question

I'm using Fullcalendar.

I have only one feature left to be implemented, which is when event dynamically bind from code behind,and i want to call an .ashx page, both are working on event property. I would like to know how I write this.

Here is my code

          var calendar = $('#calendar').fullCalendar({
                theme: true,
                header: {
                    left: 'prev,next today',
                    center: 'title',
                   right: ''
                },  
                defaultView: 'resourceDay',      
                eventClick: updateEvent,
                selectable: true,
                selectHelper: true,
                select: selectDate,
                editable: true,
                resources: [
                <%=resourcestring %>
                ],
              events: "JsonResponse1.ashx",
              events: [
                <%=eventstring %>
                ],            
                minTime: 7, 
                maxTime: 24, 
                firstDay:1,  
                eventDrop: eventDropped,
                eventResize: eventResized
        }); 

But this not working fine. Events binded, but does not call .ashx page. How can i write both events? I want to bind events and call .ashx page.

Answer 1

You can trigger the events as javascript function in which you can send the request to your .ashx file

$('#calender').fullCalendar({

   weekMode: 'liquid',    
   header: {
   left: 'prev,next today',
   center: 'title',
   right: 'month,agendaWeek,agendaDay'
},

  events: function (start, end, callback) {      
   form_data["startDate"] = start;
   form_data["endDate"] = end;
   $.ajax({
          url: '/xyz.ashx',
          data: form_data,
          type: 'POST',
          success: function (response) {
             console.log(response);
             var events = response["events"];
             callback(events);
          }
         });
     }
});//fullcalendar