Dynamically load fullcalendar with JSON data into addEventSource

22,084

I used a style suggested by the fullcalendar documentation: http://arshaw.com/fullcalendar/docs/event_data/Event_Source_Object/

So if you are using rails like I was, I had this in my document ready script:

eventSources: [{
    url: '/mymodel.json',
    ignoreTimezone: false
}],

Then in the model itself:

def index
#gets list

@mymodel = Mymodel.all.map { |r| {:title => r.title , :start => r.date, :color => '#66FF33', :end => r.enddate, :id => r.id} } 

 respond_to do |format|
    format.html
    format.json { render :json => @mymodel }
 end
end
Share:
22,084
Yasin Yörük
Author by

Yasin Yörük

Hi, I'm passionate developer. I love to working with VueJS. I mostly work on frontend developement also I have experience backend part. PHP is my favorite for backend part, I love use laravel or lumen.

Updated on July 09, 2022

Comments

  • Yasin Yörük
    Yasin Yörük almost 2 years

    Actually title is telling everything. I do a ajax call, it's return a event list.Then I want put the list into fullcalendar. This operation should be for every changed selected username.

    $.ajax({
        type: "POST",
        url: "get_event_list.php",
        data: "username="+user,
        success: function(ajaxCevap) {
    
            var obj = jQuery.parseJSON(ajaxCevap);
            var events = new Array();
    
            $.each(obj,function(index,value) {
    
                event = new Object();       
                event.title = value['title']; 
                event.start = value['start']; 
                event.end = value['end'];
                event.color = value['backgroundColor'];
                event.allDay = false;
    
                events.push(event);
            });
    
            $('#calendar').fullCalendar("removeEvents");        
            $('#calendar').fullCalendar('addEventSource', events);      
            $('#calendar').fullCalendar('refetchEvents');
    
        }
    });
    

    addEventSource is not working. Nothing append to fullcalendar.

    Here is the container : <div id="calendar"></div>

    --- EDIT ---

    I get an error : Uncaught exception: TypeError: Cannot convert 'getDaySegmentContainer()' to object

  • Yasin Yörük
    Yasin Yörük over 10 years
    How to refetch your events after username change ? This code is run at first load.
  • kjbradley
    kjbradley over 10 years
    If you "logged out" or you change your username, the page should refresh itself and the events will reload accordingly.
  • kjbradley
    kjbradley over 10 years
    If your username change stimulates a page request or refresh, it should be the same as a "first load".