Hello, first time poster on this group. Joined specifically because I have
hit a wall with this problem and though I can work around it, I would still
like to find a resolution.

I have a page where users can create new tabs. At the bottom I have a hidden
div that I clone into each new tab the user creates. The relevant HTML and
JS snippets:

<div id="sectiontemplate"> <!-- some form fields here --> </div>

// Listing A
// show() to overcome #sectiontemplate { display:none; }
$('#sectiontemplate').clone(true).appendTo('#section1').show();

// listing B
// add spinner to .spinner elements -- spinner provides up/down
// arrows on input boxes for numerical increment/decrement
$('#section1').find('.spinner').spinner({max: 100, min: 0});

Now I have two issues that I am facing.

1) When I enter some text in a form field in #section1 tab and create a new
tab, the new tab (#section2) also contains that text. This would happen if
cloning happened by reference--meaning updates in #section1 are also made to
#sectiontemplate. This seems strange so I am confused why creating a new tab
clones #section1 instead of #sectiontemplate:

// Listing C
// Inside the handler for creating a new tab (clones #sectiontemplate)
$('<div></div>').attr('id',
c).appendTo('#setup').append($('#sectiontemplate').clone(true));

To over come this I am having change the .append() part to:

// Listing D
html($('#sectiontemplate').html()).find('.spinner').spinner();

I can't understand why clone() is copying the input field values from
#section1 when I am clearly cloning #sectiontemplate


2) In Listing C, clone(true) does not copy event handlers (spinner() binds a
few keyboard and mouse click events on some elements). So yet again, I am
forced to copy the html() and re-intialize spinner().

Are these limitations/bugs or am I doing something wrong?


-- AleemB

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"jQuery Development" group.
To post to this group, send email to jquery-dev@googlegroups.com
To unsubscribe from this group, send email to 
jquery-dev+unsubscr...@googlegroups.com
For more options, visit this group at 
http://groups.google.com/group/jquery-dev?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to