Passing arguments to $.then function

Question

I have something like the following:

$(".remove-item").click(function(e) {
    e.preventDefault();

    var url = $(this).attr('href');
    var id = $(this).data("id");
    $.when(removeItem(url))
      .then(removeItemResponse(id));
});

var removeItemResponse = function(data, id) {
   console.log(data);
   console.log(id);
};

var removeItem = function(url) {
  return $.post(url);
};

The above isn't working in that I get nothing in the logs after the ajax request is processed and I know it has something to do with how I'm addressing the arguments in removeItemResponse. I need to use the returned data from the ajax post but also pass in the id I retrieved in the click function.

You've shown us everything but removeItem, could you do that? — Jonast92
– Jonast92, Commented Jul 23, 2013 at 14:57
I don't think removeItem is relevant. Knowing how it is defined won't help with passing id through to the .then callback fn. — user400654
– user400654, Commented Jul 23, 2013 at 14:57
I added the removeItem function, but I don't believe it really matters. — Gregg
– Gregg, Commented Jul 23, 2013 at 14:59

Jason P · Accepted Answer · 2013-07-23 15:03:35Z

12

removeItemResponse(id) is executing the function immediately, and you aren't passing the result of the first deferred. Try this instead:

.then(function(data) { removeItemResponse(data, id) });

done() also works here:

.done(function(data) { removeItemResponse(data, id) });

You can simplify and handle failures like so:

removeItem(url)
    .done(function(data) { removeItemResponse(data, id) });
    .fail(function(result) { /* do something else */ });

edited Jul 23, 2013 at 15:03

answered Jul 23, 2013 at 14:57

Jason P

27k3 gold badges34 silver badges45 bronze badges

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

Comments

user229044 · Accepted Answer · 2013-07-23 14:58:27Z

2

You're abusing when/then, they don't apply here. Just use .done on the promise returned from removeItem. It will be passed the result of the AJAX request (assuming it's returning the promise returned by a $.ajax invocation or the like), and then you can pass that result and the id on to your handling function:

removeItem(url).done(function (data) {
  removeItemResponse(data, id);
});

answered Jul 23, 2013 at 14:58

user229044♦

241k41 gold badges347 silver badges350 bronze badges

2 Comments

Gregg Over a year ago

I want a separate function to deal with non-200 status response, and it is working in that regard. How am I "abusing" it?

user229044 Over a year ago

when/then have a specific purpose, and this isn't it. The code you've posted can be accomplished with a single .done.

Collectives™ on Stack Overflow

Passing arguments to $.then function

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related