Wednesday, April 6, 2011

unable to get jquery clone to work correctly

This is the js code that i have currently

<script src="jquery.js type="text/javascript"></script>
<script type="text/javascript">
$('input.clone').live('click', function(){
   //put jquery this context into a var
   var $btn = $(this);
   //use .closest() to navigate from the buttno to the closest row and clone it
   var $clonedRow = $btn.closest('tr').clone();
   //append the cloned row to end of the table

   //clean ids if you need to
   $clonedRow.find('*').andSelf().filter('[id]').each( function(){
       //clear id or change to something else
       this.id += '_clone';
   });

   //finally append new row to end of table
   $btn.closest('tbody').append( $clonedRow );
});
</script>

below this, i have my table, with the clone button at the end of that table, its named and ID'd as clone.

When i click it nothing happens.

From stackoverflow
  • as you told yourself, you had to assign the class clone to the button for the selector

    $('input.clone')
    

    to work.

    had you used

    $('input#clone') or even better $('#clone')

    that would have worked for you, since you said so yourself you ID'd it as clone.

    Patrick : I appreciate the explanation, im learned a lot from this.
    Sander : yeah no problem, bit by bit you'll get to know jquery :) just remember that the selectors work alot like css, '.' for classes, '#' for ID's etc...

0 comments:

Post a Comment