Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to reset timeout in Javascript/jQuery?

I've got a field A in my webpage which, when edited by the user, invokes an API call (using jQuery), which updates field B. After the edit, the API should be called every 10 seconds to update the field B again. I currently do this using:

setTimeout(thisFunction, 10000);

The problem is that this timeout is set every time the user edits field A, which after editing field A a couple times causes the timeout to be set multiple times and the API to be called many many times. This makes the website look pretty stressy.

What I would rather like to do, is set a new timeout every time the field is edited, be it either by the user editing field A, or by the interval reaching 10 seconds and thereby polling the API. In other words; the field should be updated if field B wasn't updated for 10 or more seconds.

Lastly, if the user then clicks button C, the polling should stop.

So my question; how can I run a function to update field B if that field B wasn't updated for 10 or more seconds and how do I stop the polling when I want to (when the user clicks another button) All tips are welcome!

like image 406
kramer65 Avatar asked Mar 04 '14 19:03

kramer65


People also ask

How to reset setTimeout with JavaScript?

to call setTimeout to return a timer ID number and run the function after 115000 milliseconds. Then we call clearTimeout with myTimer to stop the timer. To reset setTimeout with JavaScript, we can call the clearTimeout function. ← How to scroll an iframe with JavaScript? → How to parse date without time zone with JavaScript?

What is the use of jQuery timeout?

In this scenario, the jquery timeout feature is used in the code. Session timeout has been a very common feature in Ajax-based web applications. In responsive interface, the programmer needs to delay the ajax request to achieve some task before the response. This can be achieved by using jQuery setTimeout () function.

What is cleartimeout () method in JavaScript?

Definition and Usage The clearTimeout () method clears a timer set with the setTimeout () method. The ID value returned by setTimeout () is used as the parameter for the clearTimeout () method. myVar = setTimeout (" javascript function ", milliseconds);

How to set timeout in JavaScript Console after 2 seconds?

For example, the code below will print "Hello World" to the JavaScript console after 2 seconds have passed: setTimeout(function(){ console.log("Hello World"); }, 2000); console.log("setTimeout() example..."); setTimeout() method example The code above will first print "setTimeout() example..."


2 Answers

A timer can be cancelled with clearTimeout, so:

var timer = null;
if (timer) {
    clearTimeout(timer); //cancel the previous timer.
    timer = null;
}
timer = setTimeout(thisFunction, 10000);
like image 153
Oscar Paz Avatar answered Sep 21 '22 13:09

Oscar Paz


var update;

// something happened

clearTimeout(update);
update = setTimeout(thisFunction, 10000);
like image 29
Alexander Støver Avatar answered Sep 18 '22 13:09

Alexander Støver