Create dtnamic html fields

[abch624]

Hi Guys,

 

I have a table that is pretty simple and stright forward

<table border="0" cellpadding="0" cellspacing="0" width="1000" align="center">
<tr>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="200" height="70" align="center">
			<tr>
				<td colspan="8" class="formHead">Personal Details</td>
			</tr>
			<tr>
				<td class="formField">
					Name
				<td>
				<td class="formField">
					DOB
				<td>
				<td class="formField">
					AIMS ID
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="350" align="center">
			<tr>
				<td colspan="6" class="formHead">
					Completed studies (subjects)*
				</td>
			</tr>
			<tr>
				<td class="formField">
					GCSE's grades
				<td>
				<td class="formField">
					A-levels or GNVQ or equivalent
				<td>
				<td class="formField">
					University and Level/Degree (inc vocational studies eg city & guilds, BTEC etc)
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="300" align="center">
			<tr>
				<td colspan="6" class="formHead">
					Current studies (institution, subject & level)
				</td>
			</tr>
			<tr>
				<td class="formField">
					Subject
				<td>
				<td class="formField">
					Level/Degree (inc vocational studies eg city & guilds BTEC etc)
				<td>
				<td class="formField">
					Institute
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="150" height="70" align="center">
			<tr>
				<td colspan="6" class="formHead">
					Career guidance
				</td>
			</tr>
			<tr>
				<td class="formField">
					Are you employed?
				<td>
				<td class="formField">
					Do you require guidance?
				<td>
			</tr>
		</table>
	</td>
</tr>
<tr>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="200" height="50" align="center">
			<tr>
				<td class="formField">
					Name
				<td>
				<td class="formField">
					DOB
				<td>
				<td class="formField">
					AIMS ID
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="350" height="50" align="center">
			<tr>
				<td class="formField">
					GCSE's grades
				<td>
				<td class="formField">
					A-levels or GNVQ or equivalent
				<td>
				<td class="formField">
					University and Level/Degree (inc vocational studies eg city & guilds, BTEC etc)
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="300" height="50" align="center">
			<tr>
				<td class="formField">
					Subject
				<td>
				<td class="formField">
					Level/Degree (inc vocational studies eg city & guilds BTEC etc)
				<td>
				<td class="formField">
					Institute
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="150" height="50" align="center">
			<tr>
				<td class="formField">
					Are you employed?
				<td>
				<td class="formField">
					Do you require guidance?
				<td>
			</tr>
		</table>
	</td>
</tr>
</table>

 

Now what I want to be able to do is that on a click of a button add the bellow part of the table again and again (depends how many times the button is invoked).

<tr>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="200" height="50" align="center">
			<tr>
				<td class="formField">
					Name
				<td>
				<td class="formField">
					DOB
				<td>
				<td class="formField">
					AIMS ID
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="350" height="50" align="center">
			<tr>
				<td class="formField">
					GCSE's grades
				<td>
				<td class="formField">
					A-levels or GNVQ or equivalent
				<td>
				<td class="formField">
					University and Level/Degree (inc vocational studies eg city & guilds, BTEC etc)
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="300" height="50" align="center">
			<tr>
				<td class="formField">
					Subject
				<td>
				<td class="formField">
					Level/Degree (inc vocational studies eg city & guilds BTEC etc)
				<td>
				<td class="formField">
					Institute
				<td>
			</tr>
		</table>
	</td>
	<td>
		<table border="1" cellpadding="0" cellspacing="0" width="150" height="50" align="center">
			<tr>
				<td class="formField">
					Are you employed?
				<td>
				<td class="formField">
					Do you require guidance?
				<td>
			</tr>
		</table>
	</td>
</tr>
</table>

 

Please help guys I have used javascript but not good at it!!

 

cheers - zahid

[jacksonmj]

Try something like the following:

 

<table id="addtable">
<tr><td>.... The original table content ....</td></tr>
</table>

<script type="text/javascript">
function addRow()
{
document.getElementById("addtable").innerHTML += "<tr><td>.... The row to add ....</td></tr>";
}
</script>
<input type="button" onclick="addRow()" value="Add">