CODEWITHSUNDEEP
jqueryajax
munna
munna

Reputation: 43

Run ajax for a fixed time if proper response is not received

function submitForm(){
    var urlid = document.getElementById("actionUrl").value;
    jQuery.support.cors = true;

    setTimeout(function(){
      $.ajax({
        url:urlid,
        type : "GET",
        crossDomain : true,
        data:transId,
        success:function(data)
        {
            alert(data);
        },

        error: function (xhr, ajaxOptions, thrownError)
        {
            console.log(thrownError);
            alert(xhr.status);
            alert(ajaxOptions);
            alert(thrownError);
        }
        });
    },1000);
};

I have an ajax call that receives one among the three responses 'true', 'false' or 'pending' from the controller. The ajax should terminate if the response is 'true' or 'false' . If the response is 'pending' the ajax should poll the controller for another 20 seconds. I should be able to pass the response to a different javascript function. Is it possible to do this in ajax/jquery ? I am new to this technology.

Upvotes: 2

Views: 1765

Answers (6)

Michael Teper
Michael Teper

Reputation: 4651

Something like this ought to do it:

function checkData (data) {
  if (data == 'true')         // do something
  else if (data == 'false')   // do something else
  else if (data == 'pending') {
    setTimeout(pollServer, 20000);
  }
}

function pollServer() {
   var urlid = document.getElementById("actionUrl").value;
   $.ajax({
    url:         urlid,
    type:        "GET",
    crossDomain: true,
    data:        transId,
    success:     checkData
    error:       // error function
  });
}

function submitForm(){
   jQuery.support.cors = true;
   pollServer();
}

Upvotes: 0

Arghya
Arghya

Reputation: 1

The setTimeOut() method is used to call a JS function after a specified amount of time.As I understand the requirement here is to keep the connection active as long as the response message is "pending".

The codes suggested above will send a new Ajax request if the response message from the server is "pending".

I'll suggest an alternative server side solution to this which worked for me in the past. You will only send back a response if the operation has succeeded or failed and configure a request timeout for that controller say (20 seconds in your case).

Hope this helps.

Upvotes: 0

munna
munna

Reputation: 43

    function aftersuccess(data)
    {
        if(data=="success"){
            document.getElementById("demo2").innerHTML = data;
            }
        else if(data=="false"){
            document.getElementById("demo2").innerHTML = data; }
        else{
            setTimeout(submitForm,1000);
            document.getElementById("demo2").innerHTML = data;
            }
    }

    var xhr;
    var i = 0;
    var transId; 
    function submitForm(){
        jQuery.support.cors = true;
        var urlid = document.getElementById("actionUrl").value;
        transId = document.getElementById("transId").value;
        transId = 'transId='+transId;

        xhr = $.ajax({
        url:urlid,
        type : "GET",
        crossDomain : true,
        data:transId,
        success:function(data)
        {
            i = i+1;
            aftersuccess(data);
        },
        error: function (xhr, ajaxOptions, thrownError)
        {
            console.log(arguments);
            console.log(xhr.status);
            console.log(ajaxOptions);
            console.log(thrownError);
            alert(xhr.status);
            alert(ajaxOptions);
            alert(thrownError);
        }
        });

        if(i>20){
            xhr.abort();
            alert("Failed :  "+transId)
            window.location.href = "random url";
        }

};

Initialised a variable i . Each time the ajax is called it is incremented. Upon reaching a particular value , i abort the ajax call and redirect the url.

Upvotes: 0

shyam
shyam

Reputation: 9368

Basically extending Michael's answer

function checkData (data) {
  if (data == 'true')         // do something
  else if (data == 'false')   // do something else
  else if (data == 'pending') {
    if ( !pollServer.stopPoll ) {
      ajaxPoll = setTimeout(pollServer, 1000);
    } else {
      // polled long enough
    }
  }
}

function pollServer() {
  $.ajax({
    url:         pollServer.urlid,
    type:        "GET",
    crossDomain: true,
    data:        transId,
    success:     checkData
    error:       // error function
  });
}

function submitForm(){
  var urlid = document.getElementById("actionUrl").value;
  jQuery.support.cors = true;
  pollServer.urlid = urlid;
  pollServer.stopPoll = false;
  ajaxPoll = setTimeout(pollServer, 1000);
  setTimeout(function() {
    pollServer.stopPoll = true;
  }, 20000);
}

Upvotes: 1

Karl Adler
Karl Adler

Reputation: 16786

there is a built in jQuery ajax timeout property, please use this: http://api.jquery.com/jQuery.ajax/

timeout
Type: Number
Set a timeout (in milliseconds) for the request.

example here: Determine if $.ajax error is a timeout

Upvotes: 0

Ben
Ben

Reputation: 57209

var ajaxtimeout = setTimeout(function(){...}

setTimeout(function() { clearTimeout(ajaxtimeout); }, 20000);

Oh, also you'll have to call .abort() on your request object, but I'm too lazy to rewrite your code :)

Upvotes: 0

Related Questions