jQuery deferred objects

Question

I'm having a tough time wrapping my head around deferred objects in jQuery.

E.G,

I thought I could use the following syntax, but this is actually running both success and fail when a success happens. I thought fail would only run if the ajax call fails?

checkFoo(widget)
.success(step1, step2)
.fail(alert("failed"));

checkFoo is an AJAX call like so

function checkFoo(widget){
   return $.ajax({
          url: "foo.php",
          data: widget,
          format: json
   });
}

The success method is deprecated in jQuery 1.8. You should use done instead of success. — Brigham
– Brigham, Commented Dec 27, 2012 at 23:40

Alex Wayne · Accepted Answer · 2012-12-27 23:38:34Z

4

This here is bad:

.success( step1(), step2() )

That will pass the result of executing step1() and the step2() as arguments.

But this here is good!

.success( step1, step2 )

It will pass the functions themselves in to be executed later.

answered Dec 27, 2012 at 23:38

Alex Wayne

188k52 gold badges328 silver badges363 bronze badges

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

4 Comments

Jason Wells Over a year ago

Thanks for that tip Alex. Any idea on why fail is running even though my ajax call is successful in my above example?

Lee Meador Over a year ago

You might want to use .then(success, failure) or use .fail(failure).success(success) as, I think, .success(func1, func2) just indicates two things to run when it resolves.

Alex Wayne Over a year ago

@JasonWells because of the exact same problem. You are calling alert() and then providing the result as the callback. You need to pass in a function.

Lee Meador Over a year ago

Good point @AlexWayne so the alert() needs wrapping in a function() {alert(...)}

T.J. Crowder · Accepted Answer · 2012-12-27 23:40:21Z

2

Your code

checkFoo(widget)
.success( step1(), step2() )
.fail( alert("checkfoo failed") );

calls step1 and step2 and alert immediately, and passes their return values into the success or fail methods. Exactly like

foo(bar());

...calls bar and passes its return value into foo.

If you want to tell jQuery to call step1 and step2 on success, and do the alert on failure, you pass in function references:

checkFoo(widget)
.success( step1, step2 )      // <== No parens, `step1` refers to a *function*
.fail( function() {           // <== Wrap a function around the alert
    alert("checkfoo failed");
});

answered Dec 27, 2012 at 23:40

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

1 Comment

Jason Wells Over a year ago

Thanks T.J, this is what I ended up doing. I also went ahead and changed success to done.

Gabriele Petrioli · Accepted Answer · 2012-12-27 23:39:35Z

2

You are using them the wrong way..

The .success() and .fail() take callback function as parameters..

so try

checkFoo(widget)
.success( function(){
    step1(); 
    step2();
})
.fail( function(){
    alert("checkfoo failed");
});

answered Dec 27, 2012 at 23:39

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

Comments

Shmiddty · Accepted Answer · 2012-12-27 23:46:29Z

0

I think you might want to pass a fhnction expression into fail:

.fail(function() {

});

edited Dec 27, 2012 at 23:46

Shmiddty

13.9k1 gold badge38 silver badges52 bronze badges

answered Dec 27, 2012 at 23:40

David G

97.6k41 gold badges173 silver badges258 bronze badges

Collectives™ on Stack Overflow

jQuery deferred objects

4 Answers 4

4 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related