CODEWITHSUNDEEP
javascriptjqueryajax
Aarika
Aarika

Reputation: 59

call a function after multiple ajax request is performed

So in my program, i have two tabs i am performing a post ajax request using form. On load of ajax two different kinds of json will appear the code is as below:

$('#myForm').submit(function () {


$.ajax({ // create an AJAX call...
        data : $(this).serialize(), // get formdata
        dataType : "json",
        //async : false,
        //timeout : 55000,
        type : $(this).attr('method'), // GET or
        // POST
        url : url.A, // the file to call
        success : function ( json ) {
            // on success..
            $('.ajaxloader').css("visibility", "hidden");
            Graph = json;
            draw(Graph);
        }
    });


 $.ajax({ // create an AJAX call...
            data : $(this).serialize(), // get formdata
            dataType : "json",
            type : $(this).attr('method'), //POST
            url : url.B, // the file to call
            success : function ( json ) {
                // on success..
                table= json;
                plot(table);
            }
        });
}

Now on josn s arrival i am first showing the table, to view my other tab, i am writing a onclick event this way..

$(init);
    function init () {

            $('body').on('click', 'a.all',function(){
                 plot(table);
            }) 
             .on('click', 'a.domain',function(){
             draw(Graph);
            });
     }

Now my problem is if i click on domain, the json would have still not loaded hence throwing a error, How do i resolve this..

So far i tried async:false (it works fine but it shows a deprecated warning) AjaxStop, works well the first time then when switching tabs it just shows no response I also tried when but since i am new to java script I didn't understand the usage at all

Upvotes: 0

Views: 133

Answers (1)

Louys Patrice Bessette
Louys Patrice Bessette

Reputation: 33933

You could try to use an Ajax global event like ajaxComplete().

var ajaxCounter = 0;

$(document).ajaxComplete(function(){
  ajaxCounter++;

  if(ajaxCounter == 2){
    $(init);
  }
});

Upvotes: 1

Related Questions