qJquery based dynamic adding and removal of html elements.
it uses the some smal jquery function like append,remove,hide etc,

Enjoy jquery. less coding huray !!

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>jQuery Test on - phpqa.blogspot.com</title>
<script type="text/javascript"
<script type="text/javascript">
function addNewToPhpqa() {
var id = $('#idVal').val();
// set a maximum value for elements
$("#phpqaToAppend").append("<p id='count" + id + "'><label
for='txt" + id + "'>Field " + id + "&nbsp;&nbsp;<input type='text'
size='20' name='txtName[]' id='txtName" + id + "'>&nbsp;&nbsp<a
href='javascript:void(0);' onClick='removeThis("+ id +");'>Remove
alert("you have reached maximum Thanks phpqa.blogspot.com");

function removeThisFromPhpqa(id) {
// or u can use
<p><a href="javascript:void(0);" onClick="addNewToPhpqa();">Add More</a></p>
<form action="#" method="get" id="phpqa">
<input type="hidden" id="idVal" value="1">
<div id="phpqaToAppend">
<p id='count1'>
<label for="txt1">
Field 1
<input size="20" name="txtName[]" id="txtName1" type="text">
<a href="javascript:void(0);"
onclick="removeThisFromPhpqa(1);">Remove this</a>
<label ></label>
<p><input type="submit" value="Submit" name="submit">
<input type="reset" value="Reset" name="reset"></p>

see demo here Demo

Happy Jquering !!


Suresh Rajagopal said... @ Saturday, August 8, 2009 at 10:55:00 AM GMT+1

Hey its not working, giving error for me.

Jey Jey said... @ Wednesday, August 12, 2009 at 4:37:00 AM GMT+1

please check the demo. you could see its working :)

Post a Comment

Please put your comments here. your questions, your suggestions, also what went wrong with me.