I'm using the following code to clone a row in a table when the user clicks on the Add button:
$('.addButton').click(function () {
$('#quotesTable tbody>tr:last').clone(true).insertAfter('#quotesTable tbody>tr:last');
});
How can I clear the values of a the new row being added so that they are empty? For example if the user selects a listbox value, and enters text into a text box, then clicks on add, the same exact row is copied with the values selected and entered.
I need the newly added row to be empty.
Thanks
You could use the find
method to find all text inputs within the clone and clear their value using the val
method, passing an empty string as the argument:
$('.addButton').click(function () {
var clone = $('#quotesTable tbody>tr:last').clone(true);
clone.find("input[type='text'], select").val("");
clone.insertAfter('#quotesTable tbody>tr:last');
});
You may want to modify the input[type='text'], select
selector if you have other controls you wish to clear as well.