CODEWITHSUNDEEP
javascriptjqueryajax
user3840570
user3840570

Reputation: 51

Error on recursive method call

I need to fetch data from and external API. Since I have to make the call again and again to check the status until the status is TRUE, I have placed it in a recursive loop. I need to know what's wrong with my logic, because I'm unable to get the desired output. Does the response.status update itself or do i need to make another ajax like how I have done in the code

   fetchFunct();
        function fetchFunct(){


         console.log("entered function");

          $.ajax
           ({
              type: "GET",
              url: "/content/mosaic/multi/preview/status/"+testId ,
              async: false,
              dataType : "json",
              success : function(response)
               {
                 console.log(response);
                 if(response.status === false)
                 {
                  console.log("Processing details"); //show still in progress
                  $("#load").show();
                  $("#heading").hide();
                  $("#b1").hide();
                  $("#b2").hide();
                  $("#b3").hide();
                  $("#b4").hide();
                  $("#b5").hide();
                 }else
                  {
                  $("#load").hide();

                   console.log("Loading 1");
                   $("#b1").click(function(){
                   $("#ad22img").attr("src","http://" + response.images.android22);})
                   console.log("Loading 2");
                   $("#b2").click(function(){$("#ad4img").attr("src","http://" + response.images.android4);})
                   console.log("Loading 3");
                   $("#b3").click(function(){ $("#apm6img").attr("src","http://" + response.images.appmail6);})
                    console.log("Loading 4");
                   $("#b4").click(function(){ $("#blbimg").attr("src","http://" + response.images.blackberryhtml);})
                    console.log("Loading 5");
                    $("#b5").click(function(){$("#iphnimg").attr("src","http://" + response.images.iphone5s);})
                    is_loaded = true;

                   }

                 }
            }).fail(function(data) { console.log("FAIL"); }).done(function(data) { console.log("coming out of ajax");
            });



if(!is_loaded)
{

console.log("entered if");

delay=delay*2;
if(delay>60)
{delay=1;}

setTimeout(fetchFunct,delay*1000);
}
//console.log("if not entered");
}

Upvotes: 1

Views: 56

Answers (1)

Curtis
Curtis

Reputation: 103368

You should call your function again inside the callback function.

if(response.status === false)
{
   console.log("Processing details"); //show still in progress
   $("#load").show();
   $("#heading").hide();
   $("#b1").hide();
   $("#b2").hide();
   $("#b3").hide();
   $("#b4").hide();
   $("#b5").hide();

   //Try again
   setTimeout(function(){
       fetchFunct();
   },1000);

}else

No need for any of the setTimeout logic beneath your AJAX call.

Upvotes: 1

Related Questions