Check if any ajax is being processed on the page?

Question

I have this code

$('#postinput').on('keyup',function(){ 
    var txt=$(this).val();

    $.ajax({
       type: "POST",
       url: "action.php",
       data: 'txt='+txt,
       cache: false,
       context:this,
       success: function(html)
       {
           alert(html);
       }

   });

});


$('#postinput2').on('keyup',function(){ 
    var txt2=$(this).val();

    $.ajax({
       type: "POST",
       url: "action.php",
       data: 'txt2='+txt2,
       cache: false,
       context:this,
       success: function(html)
       {
           alert(html);
       }

   });

});

Suppose the user clicks on #postinputand it takes 30 seconds to process. If the user clicks #postinput2. I want to warn him "Still Processing Your Previous request". Is there a way to check if any ajax works in processing?

Suppose the page has a lot of ajax work. Is there any way to know if at least one of them is being processed?

Answer 1

You can set the variable to trueor falsedepending on when the AJAX call is launched, for example:

var ajaxInProgress = false;

$('#postinput2').on('keyup',function(){ 
    var txt2=$(this).val();

    ajaxInProgress = true;
    $.ajax({
      ..
      ..
      success: function(html) {
          ajaxInProgress = false;

Now check it out if you need to before calling:

if (ajaxInProgress)
    alert("AJAX in progress!");

, AJAX

$( document ).ajaxStart(function() {
   ajaxInProgress = true;
});

$( document ).ajaxStop(function() {
   ajaxInProgress = false;
});