How to pause an event in Javascript?

Question

I'm trying since yesterday with my js code but it still doesn't work. So I have a select list, when I change the selected option it calls an onchange event that calls a DWR function.

The problem is the DWR function takes a while and resets my select options (the first element selected instead of the one selected), I tried to set the previous value but it works only when I add a while loop.

var valeurTypeUo = document.getElementById('selectElement').value;
// DWR function called by this function
forme.getOptions(params);
// console.log(document.getElementById('typesUoChoix').value) is empty String
while (document.getElementById('typesUoChoix').value != valeurTypeUo)
    document.getElementById('typesUoChoix').value = valeurTypeUo;

This is my code, it works but there is always an alert if I want to stop the script. Is there any way to replace this while instruction?

Maybe this might help : http://stackoverflow.com/questions/951021/what-is-the-javascript-version-of-sleep — Spandan Thakur, Nov 17 '16 at 10:13
Can you show the `forme.getOptions(params)` function? Does DWR have a callback that you can propogate? — Davin Tryon, Nov 17 '16 at 10:17
You can delay the execution of a block of code, but other code on the same level before that delay will still execute -- this is because as far as I'm aware, ``setTimeout`` is not asynchronous. — Joshua, Nov 17 '16 at 10:24
@reporter it shows me this error > SyntaxError: missing ; before statement I did the same like on the example — Chinovski, Nov 17 '16 at 10:25
@DavinTryon There is not a call back, but instructions that take time to execute like Collections.sort (the code of DWR is a composed of more than a hunderd line. — Chinovski, Nov 17 '16 at 10:31
So, you can provide a callback and then handle it here. correct? — Davin Tryon, Nov 17 '16 at 10:32
@Crowes `setTimeout` _is_ async. Why would you think it isn't? When you do `foo(); setTimeout(bar, 1000); baz();` both `foo` and `baz` will execute immediately, but `bar` will run a second later. — VLAZ, Nov 17 '16 at 10:38
@vlaz I can't recall where I read it, but it's the fact that (in your example), `foo()` and `baz()` execute immediately whilst `bar()` not until after your `1s` delay, meaning `setTimeout` is not a wait, it only delays the execution of that code black and then the program continues, instead of only continuing after the execution of `bar()`. — Joshua, Nov 17 '16 at 11:28

score 2 · Accepted Answer · answered Nov 17 '16 at 10:32

You can use setInterval which you can clear instead of while.

Your code can be like:

   var stopCheking = false;
   var checkingInterval; // interval holder

   var valeurTypeUo = document.getElementById('selectElement').value;

   // DWR function called by this function
   forme.getOptions(params);

   // console.log(document.getElementById('typesUoChoix').value) is empty String

   checkingInterval= setInterval( function() { 
     if( stopCheking ) clearInterval(checkingInterval);
   }, 2);

When you want to stop the event (interval) in this case, you set the stopCheking flag to true.

score 0 · Answer 2 · answered Nov 17 '16 at 10:30

You can "pause" functions with ES6 generators(yield keyword), but normally you should not need it in this case. Plain callback on the async call should do it.

Anyways here is the link for generators: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*

How to pause an event in Javascript?

2 Answers2