I had gone through many solutions for the above problem but they are quite confusing as I ‘cell left & cell right’ didn’t seem to be applicable in my case.
Using clone method of jQuery is quite simpler, but there is also one problem. The problem is that when I clone the last row it will copy all data from above row. another problem attached to it is : ID. When cloning is done, same ‘name’ & ‘ID’ is copied which will create problem while posting data, so I need dynamics in this too. So I m not getting that how can we pass data to clone function which will solve dynamic ‘attribute’ problem.
CODE:
<table id="advertisement_main_table" class="table" cellpadding="4" cellspacing="1" width="100%;">
<tr class="odd align_center">
<td>1.</td>
<td><input type="text" id="ad_elements" class="textbox_150_with_border"></td>
<td><textarea id="ad_description" rows="01" cols="50" class="advertisement_textarea" ></textarea></td>
<td><input type="text" id="ad_duration" class="textbox_60_with_border"></td>
<td><input type="text" id="ad_loop_day" class="textbox_60_with_border"></td>
<td><input type="text" id="ad_seconds_played" class="textbox_100_with_border"></td>
</tr></table>
Now in above code <td>1.</td> is hardcoded but how to appended ‘suffix’ in every id like ‘ad_element_1′,’ad_duration_1′,,,’ad_element_2′,’ad_duration_2’ in next <tr> and so on..
I hope you understand what I want to say
Part of the solution is to use
<input type="text" name="ad_elements[]" class="textbox_150_with_border" />instead of an id there. That way when it’s cloned the name is still valid, and you’ll just receive an array of ad_elements entries when it’s posted.For the rest, like turning the “1.” into “2.”, I’m afraid there is no magic bullet, you’ve to do that yourself after the cloning, it’s fairly easy in this particular case though:
$(new_tr).find(‘td:first-child’).text(function(text) {
return (parseInt(text)+1) + “.”;
});
Just replace new_tr by whatever variable contains the cloned TR.