Bug Tracker

Opened 6 years ago

Closed 6 years ago

#13098 closed bug (notabug)

Problem with chained detach() call

Reported by: bryantg@… Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: git
Keywords: Cc:
Blocked by: Blocking:

Description

My code is something like this:

$('#container')
  .find('#item1, #item2')
    .detach()
    .appendTo('#destination')
    .end()
  .find('form') . . .

When I execute this, no form element is found, though there is one in "container". If I comment out the calls to detach() and appendTo(). It does find the form. So there's something weird going on with those two methods, it would seem, when they are executed inline.

When the above didn't work, I tried placing these two methods in a call to each() like so:

$('#container')
  .find('#item1, #item2')
    .each(function() {
      $(this).detach().appendTo('#destination')
    })
    .end()
  .find('form') . . .

This produced the expected results. So the question is, why did the combination of detach() and appendTo() not work inline but did work within the context of each()?

Change History (5)

comment:1 Changed 6 years ago by dmethvin

Based on the markup it looks like you expect the .end() to get you back to #container? In 1.8.3 or lower if there is only one element it does not push. Otherwise it does, so if you have two elements (it seems you do) then you are only back to the #item1, #item2 set.

As of 1.9, .appendTo() will always push a new set but that wouldn't change your case here.

comment:2 in reply to:  1 Changed 6 years ago by anonymous

Replying to dmethvin:

Based on the markup it looks like you expect the .end() to get you back to #container? In 1.8.3 or lower if there is only one element it does not push. Otherwise it does, so if you have two elements (it seems you do) then you are only back to the #item1, #item2 set.

As of 1.9, .appendTo() will always push a new set but that wouldn't change your case here.

Ah, good call. I added another end(), and that worked. So it would seem that detach() takes us up another level. I was not expecting that based on the documentation. Might want to amend that for the sake chain happy coders like me. Thanks. :)

comment:3 Changed 6 years ago by dmethvin

No, the .find() and .appendTo() are the ones stacking. The indentation would go like this, if you nested them at the same level where the stacking occurred:

$('#container')
  .find('#item1, #item2')
    .detach()
    .appendTo('#destination')
    .end() // ends the .appendTo()
  .end()   // ends the .find()
  .find('form')
    ...etc

TBH I've never seen anyone use an .end() after an .appendTo(), and you'll want to be careful since up to 1.8.3 it doesn't stack in all cases. The docs for .appendTo() do describe the current behavior though.

comment:4 in reply to:  3 Changed 6 years ago by anonymous

Replying to dmethvin:

No, the .find() and .appendTo() are the ones stacking. The indentation would go like this, if you nested them at the same level where the stacking occurred:

$('#container')
  .find('#item1, #item2')
    .detach()
    .appendTo('#destination')
    .end() // ends the .appendTo()
  .end()   // ends the .find()
  .find('form')
    ...etc

TBH I've never seen anyone use an .end() after an .appendTo(), and you'll want to be careful since up to 1.8.3 it doesn't stack in all cases. The docs for .appendTo() do describe the current behavior though.

Oh, gotcha. Many thanks for the quick reply. Will have to take another look at appendTo().

comment:5 Changed 6 years ago by dmethvin

Resolution: notabug
Status: newclosed
Note: See TracTickets for help on using tickets.