How to lock AJAX functions from overlapping?

Question

I've got one function checkEvery15Seconds that runs every 15 seconds. It checks to see if new comments have been added to a page.

I've got a form that submits a new comment once the submit button is pressed, then displays the new comment on the page.

In the process of adding a new comment checkEvery15Seconds is querying the database at the same time, so I end up with duplicate comments on the page (not in the database though, this is purely a JavaScript issue).

How can I get my "submitComment" function to stop checkEvery15Seconds and restart it after the "submitComment" function has finished executing?

Answer 1

add a boolean called somewhat suspend15sCheck in a scope which is accessible by both functions. enable it while adding the comment and afterwards set it to false again.

in your 15sCheck-function you first have to check if you are allowed to check :-)

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 :-)

    }
}