javascript - JS, fullcalendar, the "events" parameter doesn't get the result of an executed function

answer : the mistake was not in the synchronous or asynchronous call but in utilisation of functions set by the fullcalendar.
events: function(start,end,timezone,callback){...}

I can see informations switch how i manage the result of the ajax (sjax...) but the calendar doesn't get the information.

It seems the line "events : getJSON," doesn't work. But the function is call

Now, i have a new problem, the function getJSON get the JSON from the webmethod, but the calendar doesn't show them.

I tried to get the result with the commented code also, but it doesn't work.

here are both methods froms the js :

function getJSON() {
    start = $('#calendar').fullCalendar('getDate').format();

    duration = $('#calendar').fullCalendar('getCalendar').moment().format();
    alert(start);
    var retour;
    $.ajax({
        async: false,
        type: 'POST',
        url: "ConsultationPlanning.aspx/getPlanning",
        data: '{"start": "' + start + '", "end": "' + duration + '"}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",

        success: function (msg) {
            retour = JSON.parse(msg.d);
            retour = msg.d;
        },
        error: function () { alert("erreur");}
    });
    alert(retour);
    return retour;
};


$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    hiddenDays: [0],
    defaultView: 'agendaWeek',
    editable: false,
    allDaySlot: false,

    selectable: false,
    events: getJSON,
        /*function (start, end, callback) {
        start = $('#calendar').fullCalendar('getDate').format();
        duration = $('#calendar').fullCalendar('getCalendar').moment().format();
        $.ajax({
            type: 'POST',
            url: "ConsultationPlanning.aspx/getPlanning",
            data: '{"start": "' + start + '", "end": "' + end + '"}',
            contentType: "application/json; charset=utf-8",

            dataType: "json",
            success: function (msg) {
                var rdv = [];
                alert(msg.d);
                //var events =JSON.parse(msg.d);
                $(msg.d).each(function () {
                    rdv.push({
                        id: $(this).attr('id'),
                        title: $(this).attr('title'),
                        start: $(this).attr('start'),

                    })
                })
                alert("first date : " + rdv[0].start);
                //"first date: 2015-05-06T14:33:00" is what i get
                callback(rdv);
                //the callback generate an error message. it says, it's waiting for a function

            }
        })
    }

});

i posted a similar question few days ago, but it was with an other implementation:

fullcalendar doesn't show events

Answer

$.ajax triggers an asynchronous call ; the value of your retour variable will be set to the value you expect only after your browser has received the response to its request.

That's why fullcalendar's events is called with a callback argument :

function getJSON(start, end, callback) {
    ...
    $.ajax({
        ...
        success : function(msg) {
            retour = JSON.parse(msg.d);
            callback(retour);
        }
    });

    // no need to return anything here
}

See the doc for fullcalendar v1.* here : events function

---

Note : if you are using fullcalendar v2 or higher, you should change your function signature to :

function getJSON(start, end, timezone, callback) {
     ...

see doc for v2.* here : events function