Empty object array

Question

Empty object array

Navigation

#1 by (0 votes)

0

I have a problem creating an array of objects. I have a function that does an ajax request and inserts objects into an array in a loop.

It happens that within the success of the request, the array is shown in the console and through an alert the right way, but outside the request the alert appears as an empty array, [].

        var arrayEvent = [];

        $.ajax({
            type        :   "POST",
            url         :   http_base + "/agendamento/buscaProfessor",
            data        :   {day:day, month:month, year:year},
            cache       :   false,
            dataType    :   "json",
            success :   function(data)
            {
                for (var i = 0; i < data.length; i++){
                    data[i].data = data[i].data.replace(" ", "T");
                    var obj = {title: String(data[i].professor), start: String(data[i].data)};
                    arrayEvent.push(obj);
                }

                /*1*/alert(JSON.stringify(arrayEvent));
                /*1*/console.log(arrayEvent);
            },
            error   :   function(jqXHR, textStatus, errorThrown)
            {
                console.log(textStatus);
            }
        });

        /*2*/alert(JSON.stringify(arrayEvent));
        /*2*/console.log(arrayEvent);

Array stringify alert result

Within the success of the requisition:

/*1*/[{"title":"Professor2","start":"2018-04-26T17:00:00"},{"title":"Professor 
1","start":"2018-04-27T17:00:00"}]

Outside:

/*2*/[]

Console.log

/*2*/[]

0:{title: "Professor2", start: "2018-04-26T17:00:00"}
1:{title: "Professor 1", start: "2018-04-27T17:00:00"}
length : 2

/*1*/(2) [{…}, {…}]
0:{title: "Professor2", start: "2018-04-26T17:00:00"}
1:{title: "Professor 1", start: "2018-04-27T17:00:00"}
length:2

How could you proceed to solve this problem?

javascript

asked by anonymous 25.04.2018 / 17:29

1 answer

Error getting response Send button in a form

score 0 · Answer 1

Basically the problem is that an http request is asynchronous, so the browser will go through the entire block of your javascript function, and then go to the server.

Because of this the block below does not work.

    /*2*/alert(JSON.stringify(arrayEvent));
    /*2*/console.log(arrayEvent);

You are printing an empty array, as the server has not yet returned. For what you want to happen, you must use the done method, which will run when your ajax request is executed successfully.

Change your code with the solution:

    var arrayEvent = [];

    $.ajax({
        type        :   "POST",
        url         :   http_base + "/agendamento/buscaProfessor",
        data        :   {day:day, month:month, year:year},
        cache       :   false,
        dataType    :   "json",
        success :   function(data)
        {
            for (var i = 0; i < data.length; i++){
                data[i].data = data[i].data.replace(" ", "T");
                var obj = {title: String(data[i].professor), start: String(data[i].data)};
                arrayEvent.push(obj);
            }

            /*1*/alert(JSON.stringify(arrayEvent));
            /*1*/console.log(arrayEvent);
        },
        error   :   function(jqXHR, textStatus, errorThrown)
        {
            console.log(textStatus);
        }
    }).done(function(){
        /*2*/alert(JSON.stringify(arrayEvent));
        /*2*/console.log(arrayEvent);   
    });