HTML table manipulation using jQuery
- by Daniel
I'm building a site using CakePHP and am currently working on adding data to two separate tables at the same time.. not a problem.
The problem I have is that I'm looking to dynamically alter the form that accepts the input values, allowing the click of a button/link to add an additional row of form fields.
At the moment I have a table that looks something like this:
<table>
<thead>
<tr>
<th>Campus</th>
<th>Code</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<select id="FulltimeCourseCampusCode0CampusId" name="data[FulltimeCourseCampusCode][0][campus_id]">
<option value=""></option>
<option value="1">Evesham</option>
<option value="2">Malvern</option>
</select>
</td>
<td>
<input type="text" id="FulltimeCourseCampusCode0CourseCode" name="data[FulltimeCourseCampusCode][0][course_code]">
</td>
</tr>
</tbody>
What I need is for the row within the tbody tag to be replicated, with the minor change of having all the zeros (i.e. such as here FulltimeCourseCampusCode0CampusId and here data[FulltimeCourseCampusCode][0][campus_id]) incremented.
I'm very new to jQuery, having done a few minor bits, but nothing this advanced (mostly just copy/paste stuff).
Can anyone help? Thank you.
