Snippet Name: Add more fields to a form dynamically
Description: Shows how to add more fields to a form by clicking a link or button.
Also see:
» Add a hidden field to a form dynam...
» Validate file extensions in upload...
» Add and Remove classes in Javascri...
» Easy way to break apart an email a...
» Date Picker Form in ASP
» Check for a Valid Email Address (V...
» Check For A Valid Email Address
» Getting Values Submitted From A Fo...
» Add PSOUG Search to SQL Developer
» Format money as millions, billions...
» Dynamically add and remove elements
» Convert UK Dates To mySQL Format D...
» Add a period at the end of a strin...
» Calculate the difference between t...
» Dynamically Add/Remove rows in HTM...
» RMAN: Format Directives
» USER - connection information
» USER - User Information 2
» USER Information
» SQL*Plus formatting
» Create string by formatting an amo...
» Check email address
» Date Functions: ADD_MONTHS
» Date Functions: Add and Subtract f...
» List security related profile info...
» Currency display formatting functi...
» Nicely Format File Size
» GET and POST variables in hidden f...
» Add dashes to credit card numbers
Comment: (none)
Author:
Language: HTML4STRICT
Highlight Mode: HTML4STRICT
Last Modified: January 30th, 2011
|
<html>
<head>
<script>
var id = 2;
function add_phone_field()
{
var obj = document.getElementById("phone");
var data = obj.innerHTML;
data += "<input type='text' name='person_phone[]' id='person_phone"+id+"' /><br />";
obj.innerHTML = data;
id++;
}
</script>
</head>
<body>
<form method="post" action="" enctype="multipart/form-data">
<table width="800" border="0" dir="rtl" style="direction:ltr;">
<tr>
<td scope="col" style="direction:rtl;"><label for="textfield"> name</label>
<div align="right">
<input type="text" name="person_name" id="person_name"/>
</div></td>
</tr>
<tr>
<td style="direction:rtl;"><label for="textfield">job</label>
<div align="right">
<input type="text" name="person_job" id="person_job" />
</div></td>
</tr>
<tr>
<td style="direction:rtl;"><label for="label">mobile</label>
<div align="right">
<input type="text" name="person_mobile" id="person_mobile" />
</div></td>
</tr>
<tr>
<td style="direction:rtl;"><label for="label2" >phone</label>
<span style="color:#00f;font-size:20px;font-weight:bold;cursor:pointer;" onclick="add_phone_field()">[+]</span>
<div id="phone" align="right">
<input type="text" name="person_phone[]" id="person_phone1" /><br />
</div></td>
</tr>
<tr>
<td style="direction:rtl;"><label for="label3">email</label>
<div align="right">
<input name="person_email" type="text" id="person_email" />
</div></td>
</tr>
<tr>
<td><label for="label4"></label>
<div align="right"></div></td>
</tr>
<tr>
<td colspan="2"><p align="right">
<input name="add" type="submit" id="add" value="add" />
</p></td>
</tr>
</table>
</form>
</body>
</html> |
