How to block AJAX functions from overlapping?

Question

I have one function checkEvery15Secondsthat runs every 15 seconds. It checks to see if new comments have been added to the page.

I have a form that submits a new comment after clicking the submit button, and then displays the new comment on the page.

In the process of adding a new comment, it checkEvery15Secondssimultaneously queries the database, so I get duplicate comments on the page (but not in the database, but this is just a problem with JavaScript).

How can I make my submitComment function stop checkEvery15Secondsand restart it after the submitComment function completes?

Answer 1

, suspend15sCheck , . , , false.

15sCheck , : -)

var suspend15sCheck = false;

function addComment()
{
  suspend15sCheck = true;

  // add comment on base of form data

  suspend15sCheck = false;
}

function myTimer()
{
    if(suspend15sCheck === false) 
    {

      // add comments via ajax request
      // remember to check if the comments who will be added already exist :-)

    }
}

Answer 2

, / .

function My15SecondsObj() {
    var objSelf = this;

    // 
    this.run();
}

My15SecondsObj.Paused = false;
My15SecondsObj.prototype.run= function() { 
   if (!Paused)
   {
      // Do your call here
   }
   var _this = this;
   setTimeout(function() { _this.run(); }, 15000);

}

, ,

var myObj = new My15SecondsObj();

,

myObj.Paused = true;

, :

myObj.Paused = false;

, , , ..

Answer 3

: , . "checkEvery15Seconds" : if (!global_checkingEvery15Seconds) return;

Just set this variable (regardless of what you call it global or object bound) to true if you want the check to be turned on and off when you don't.

Answer 4

You will need a status variable indicating the current status of the comment ajax request

var requestComments = false;

if(requestComments === false) {
  requestComments = true;
  // make ajax request

  // on ajax success/fail
  requestComments = false;
}