0

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!

Nelson
  • 49,283
  • 8
  • 68
  • 81
Rick
  • 441
  • 1
  • 3
  • 15

1 Answers1

1

You can do like this:

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

See working demo

Nelson
  • 49,283
  • 8
  • 68
  • 81
  • The `shows()` are only needed if those elements were hidden (i.e. `display: none`) by some css rule, if not you can avoid them. – Nelson Nov 09 '12 at 17:44
  • Your code seems to work great! If I "Show Form Details", I can see the new value. BUT, when I submit the form, the new value is not getting picked up by the form processor... – Rick Nov 09 '12 at 17:46
  • HA! My bad... I have all the form control names set as arrays, but forgot to add the [] to my cloned control. Added it and now works great! Thanks Nelson for your help! – Rick Nov 09 '12 at 17:56