Search code examples
jquerydom-traversaljquery-traversing

Jquery to update inputbox after clone

I have the following code:

$(document).ready(function($) {
$(".dispadd").click(function(event) {
    event.preventDefault();
    $('#hiddenrow')
        .clone()
            .removeAttr('id')
            .show()
            .appendTo( $('#disptable').after().show() 
    );
});
});

Works great to copy a table row containing form controls from one table to another. My question is now, how do I update one of the form input fields as it is being added to its new table? The form input I need to update (type=text) has a name and id of cat.

Thanks for any assistance!

Solution

  • You can do like this:

    $('#hiddenrow')
        .clone()
            .removeAttr('id').find('#cat').val('newvalue').end()
            .show()
            .appendTo( $('#disptable').after().show() 
);

    See working demo