RSS

Adding and Removing Text Boxes Dynamically

25 Jul

You can easily add and remove text box dynamically with the help of javascript:

following  is Javascript code:

<script type=”text/javascript”>
var intTextBox=0;

//FUNCTION TO ADD TEXT BOX ELEMENT
function addElement()
{
intTextBox = intTextBox + 1;
var contentID = document.getElementById(“content”);
var newTBDiv = document.createElement(“div”);
newTBDiv.setAttribute(“id”,”strText”+intTextBox);
newTBDiv.innerHTML = “Text”+intTextBox+”: <input type=’text’ id='” + intTextBox + “‘ name='” + intTextBox + “‘>”;
contentID.appendChild(newTBDiv);
}

//FUNCTION TO REMOVE TEXT BOX ELEMENT
function removeElement()
{
if(intTextBox != 0)
{
var contentID = document.getElementById(“content”);
contentID.removeChild(document.getElementById(“strText”+intTextBox));
intTextBox = intTextBox-1;
}
}
</script>

following is the PHP Code :

<body>
<p>Demo of Adding and Removing Text Box Dynamically using JavaScript</p>
<input type=”button” onclick=”addElement()” value=”Add”> <br><input type=”button” onclick=”removeElement()” value=”Remove”></p>
<div id=”content” ></div>
</body>

 
Leave a comment

Posted by on Jul 25, 2011 in PHP

 

Tags: , , , , , , , ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: