documentFragment.cloneNode(true) doesn't clone jQuery data
- by taber
I have a documentFragment with several child nodes containing some .data() added like so:
myDocumentFragment = document.createDocumentFragment();
for(...) {
myDocumentFragment.appendChild(
$('').addClass('button')
.attr('href', 'javascript:void(0)')
.html('click me')
.data('rowData', { 'id': 103, 'test': 'testy' })
.get(0)
);
}
When I try to append the documentFragment to a div on the page:
$('#div').append( myDocumentFragment );
I can access the data just fine:
alert( $('#div a:first').data('rowData').id ); // alerts '103'
But if I clone the node with cloneNode(true), I can't access the node's data. :(
$('#div').append( myDocumentFragment.cloneNode(true) );
...
alert( $('#div a:first').data('rowData').id ); // alerts undefined
Has anyone else done this or know of a workaround? I guess I could store the row's data in jQuery.data('#some_random_parent_div', 'rows', [array of ids]), but that kinda defeats the purpose of making the data immediately/easily available to each row.
I've also read that jQuery uses documentFragments, but I'm not sure exactly how, or in what methods. Does anyone have any more details there?
Thanks!
