Javascript sequential execution after trigger

Question

I'm having trouble with the way javascript execute the code (async)

I have this small piece of code that will trigger events and check the value of 'valid'.

My problem is that 'valid' is always true when entering the if statement because the events have not finished processing yet :

valid = true;

$(this).find('input').trigger('blur');
//valid will be modified in the triggered events

if(valid){
    //Do something
}

So I'd like to wait till the events are finished to enter the statement, but trigger doesn't take a callback

I have seen some questions about this already solved but I didn't understand them and how to implement them.

What should I use to solve this ?

Where's the code that gets executed when the input is blurred? — j08691
– j08691, Commented Mar 13, 2015 at 16:27
Is this related/a duplicate? In theory it should be synchronous, so yes - we need to see your blur handler. — James Thorpe
– James Thorpe, Commented Mar 13, 2015 at 16:27
What is $(this)? why don't you just have an event function - $('input').on('blur', function(){}); — Adjit
– Adjit, Commented Mar 13, 2015 at 16:28
No need to use trigger. You can directly use blur on element. It's better to post more code for helping. — hamed
– hamed, Commented Mar 13, 2015 at 16:32
@Adjit $(this) is a form, I'm inside a function that's just why I used $(this) — Tofandel
– Tofandel, Commented Mar 13, 2015 at 16:32

Tofandel · Accepted Answer · 2015-03-13 16:40:19Z

0

Thanks to JamesThorpe I found the answer I was looking for :

 valid = true;
 $.when($(this).find('input').trigger('blur')).done(function(){
     if(valid){
         //Do something
     }
 });

And now the if statement only gets executed after the events are triggered

answered Mar 13, 2015 at 16:40

Tofandel

3,6551 gold badge41 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

You should delete this question it is a duplicate

Salil Dabholkar · Accepted Answer · 2015-03-13 16:41:47Z

0

As you want to have it triggered on blur, you can do it like this:

$(this).find('input').on('blur', function(){
    if(valid){
        //Do something
    }
});

Note that the function will be triggered on all blur events. To have it only once use .one()

answered Mar 13, 2015 at 16:41

Salil Dabholkar

6223 silver badges7 bronze badges

hamed · Accepted Answer · 2015-03-13 16:43:14Z

0

I don't understand why you are using trigger. I think you can directly use blur event:

$(this).find('input').blur(function(){
    if(valid)
      //do something
});

answered Mar 13, 2015 at 16:43

hamed

8,04517 gold badges66 silver badges119 bronze badges