Sequential execution of Ajax requests

Question

The script should take the user's session via ajax and transfer it to other ajax requests that take the data for the charts. The first request succeeds, but others have not, becouse sessionId for them is undefined. Tried to wrap them in a function, but unfortunately nothing happened. What can be done?

var sessionId,
    requestInWorkCount,
    requestInWorkPower;

function getSession(){
  $.getJSON("http://192.168.1.142/DashboardService.svc/web/jsonLoginUser?UserID=User1&UserPassword=123", {},
                    function(data) {
                    $.each(data, function (key, val) {
                      sessionId = val.toString();
                      return sessionId;
                    })
                });
};

function getData(session){
      $.getJSON("http://192.168.1.142/DashboardService.svc/web/jsonGetIndicator?SessionID="+session+"&IndNum=1", {},
                function(data) {
                $.each(data, function (key, val) {
                  requestInWorkCount = val;
                  return requestInWorkCount;
                })
            });
      $.getJSON("http://192.168.1.142/DashboardService.svc/web/jsonGetIndicator?SessionID="+session+"&IndNum=2", {},
                function(data) {
                $.each(data, function (key, val) {
                  requestInWorkCount = val;
                  return requestInWorkPower;
                })
              });
    };
$(document).ready(function(){
  getSession();
  getData(sessionId);
  setInterval('show()',1000); 

});

score 3 · Accepted Answer · answered May 07 '14 at 07:29

ajax call is async so your second ajax call is executed before the first completes thats the reason sessionId is undefined.

Use the success function of first ajax call and call GetData() in it.

Also you don't need to return sessionId

function getSession(){
  $.getJSON("http://192.168.1.142/DashboardService.svc/web/jsonLoginUser?UserID=User1&UserPassword=123", {},
                    function(data) {
                    $.each(data, function (key, val) {
                      sessionId = val.toString();
                      getData(sessionId);

                    })
                });
};

you call like this now:

    $(document).ready(function(){

      getSession();


    });

score 0 · Answer 2 · answered May 07 '14 at 07:30

The AJAX request are asynchronous and you cannot execute them sequentially.

An easy solution here would be to call getData() inside AJAX success block:

function getSession() {
    $.getJSON("http://192.168.1.142/DashboardService.svc/web/jsonLoginUser?UserID=User1&UserPassword=123", {}, function(data) {
        $.each(data, function (key, val) {
            sessionId = val.toString();
            getData(sessionId);
            return sessionId;
        });
    });
};

score -1 · Answer 3 · answered May 07 '14 at 07:30

-1

You have to take the RESPONSE of the ajax request. You do not return it, I believe. But in your code you should perhaps do

sessionId = getSession();
getData(sessionId);

You forgot to dereference what it returned.

answered May 07 '14 at 07:30

Jekk

577
8
27

$.getJSON returns an jqXHR object, not the response of the call. – lordvlad May 07 '14 at 07:32

Sequential execution of Ajax requests

3 Answers3