add and remove elements with javascript
sample page for creating dynamic elements in HTML using Javascript.
For working Please COPY & PASTE in an editor and run it on browser.
Please edit the Js part for modify the code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>phpsimple add and remove elements with javascript</title>
<meta name="GENERATOR" content="Quanta Plus">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
//Please edit the Js part for modify the code
function show_new()
{
var id=document.getElementById('count').value;
var currentVal = document.getElementById('showTr').innerHTML;
document.getElementById('showTr').innerHTML = currentVal +"<tr><td align=\"center\" width=\"33%\">"+id+"<input type=\"text\" name=\"events_venue_"+id+"\" ></td><td align=\"center\" width=\"33%\"><input type=\"text\" name=\"events_title_"+id+"\" size=\"10\"></td><td align=\"center\" width=\"33%\"><input type=\"radio\" name=\"events_date_"+id+"\">Yes <input type=\"radio\" name=\"events_date_"+id+"\">No</td></tr>";
document.getElementById('count').value = parseInt(id)+1;
}
</script>
</script>
</head>
<body>
<TR>
<TR>
<td align="center" colspan="2"> <a href="javascript:void(0);" onclick="show_new()">add more</a></td>
</TR>
<tr><TD><table id="showTr">
<tr><td align="center" width="33%"><input type="text" name="events_venue" ></TDd><td align=center
width=33%><input type='text' name="events_title" size="10"></td><td align="center" width="33%"><input type="radio" name="events_date">Yes <input type="radio" name="events_date">No</td></tr>
</table>
</TD>
</tr>
<TR>
<td align="center" colspan="2"><input type="hidden" name="count" id="count" value="2"></td>
</TR>
</table>
</body>
</html>
