Skip to main content

Bug Tracker

Side navigation

#8332 closed bug (invalid)

Opened February 20, 2011 09:20PM UTC

Closed February 21, 2011 12:02AM UTC

Last modified February 21, 2011 01:22PM UTC

wrapAll with <tr> does nothing

Reported by: Marc Bourlon Owned by:
Priority: low Milestone: 1.next
Component: manipulation Version: 1.5
Keywords: Cc:
Blocked by: Blocking:
Description

var tds = $('<td></td><td></td><td></td>');

tds.wrapAll('<tr></tr>');

does nothing!

Maybe I'm wrong here, but I stumbled upon this because one of my jQuery template, a ''tr'' containing some ''td''s, was transformed into only the list of ''td''s. Trying to insert a ''wrapAll('<tr></tr>')'' before the appendTo table was still failing.

Attachments (0)
Change History (2)

Changed February 21, 2011 12:02AM UTC by jitter comment:1

_comment0: Thanks for taking the time to contribute to the jQuery project by writing a bug report. \ \ This isn't a bug but just a slight misunderstanding on how `.wrapAll()` works and what happens with the jQuery object (the collection it represents) when calling `.wrapAll()`. \ \ If you call `.wrapAll()` on a jQuery object all elements in the collection get wrapped with the HTML structure you provided, but that doesn't mean that after the call the collection suddenly changed and now holds the "new" parents of the before wrapped elements. In fact the collection doesn't change at all and still holds the same elements as before so that you can continue chaining methods and make further e.g. modifications to the elements. \ \ In the case of elements attached to the DOM this often goes by unnoticed (especially when you don't have any other methods chained after the wrappAll). \ \ In the case of detached elements (as in your `$("<td></td><td></td><td></td>")`) you need to know this. Because else when you call `.appendTo()` it appends the td's to the target instead of the tr. So you only need to call `.parent()` before the call to ´.appendTo()`. \ \ Also check this [http://jsfiddle.net/jitter/wDfem/ test case] which illustrates how `.wrapAll()` works with attached and detached elements1298246655394924
component: unfiledmanipulation
priority: undecidedlow
resolution: → invalid
status: newclosed

Thanks for taking the time to contribute to the jQuery project by writing a bug report.

This isn't a bug but just a slight misunderstanding on how .wrapAll() works and what happens with the jQuery object (the collection it represents) when calling .wrapAll().

If you call .wrapAll() on a jQuery object all elements in the collection get wrapped with the HTML structure you provided, but that doesn't mean that after the call the collection suddenly changed and now holds the "new" parents of the before wrapped elements. In fact the collection doesn't change at all and still holds the same elements as before so that you can continue chaining methods and make further e.g. modifications to the elements.

In the case of elements attached to the DOM this often goes by unnoticed (especially when you don't have any other methods chained after the wrappAll) as the new parent (parents) are directly inserted into the DOM and you immediately see it worked.

In the case of detached elements (as in your $("<td></td><td></td><td></td>")) you need to be aware of this. Because else when you call .appendTo() it appends the td's the collections holds to the target, instead of the tr as you intended. So you only need to call .parent() before the call to ´.appendTo()`.

Also check this test case which illustrates how .wrapAll() works with attached and detached elements

Changed February 21, 2011 01:22PM UTC by anonymous comment:2

Thank you very much jitter, I was thinking about something like this, but didn't think about parent().

However, it doesn't explain the problem, this time, I think, a bug, seen in using the template system, dropping the outermost tr from the template.

Let me try to do an example with jsFiddle, too ;-)

Best,