Jump to content

Add a new row to contact page


timhersh

Recommended Posts

Help. I have been trying to figure this one our for  awhile. i am working on a html page for a client. It is a simple contact form that the user will fill out and the answers will be submitted through form2mail.php to send it to the clients email.

 

I already have the entire form setup, there is several rows of info (he is an insurance agent and needs each employee's

Name, address, city , zip, birthday, number of kids, etc

 

the problem is this---I have the page setup for the user to enter up to 10 different employees info----but the client would like me to add a button that will automatically add a new row.

 

I have figured out how to add a new text box----but I need to add an entire new row of info---8 different textboxes at once--each one will have a different value once entered.

 

any ideas? thanks

Link to comment
Share on other sites

Top section goes in the head of the document

 

<script type="text/javascript">
var clone;
function cloneRow(){
var rows=document.getElementById('mytab').getElementsByTagName('tr');
var index=rows.length;
clone=rows[index-1].cloneNode(true);
var inputs=clone.getElementsByTagName('input'), inp, i=0 ;
while(inp=inputs[i++]){
inp.name=inp.name.replace(/\d/g,'')+(index+1);
}
}
function addRow(){
var tbo=document.getElementById('mytab').getElementsByTagName('tbody')[0];
tbo.appendChild(clone);
cloneRow();
}
onload=cloneRow;
</script>

 

this is your actual form just edit the values of each row  i have mine set to defualt at 4 rows  this script will build an array when submitted

 

		<table id="mytab" style="width:150px;">

				<th valign="top">Quantity</td>
				<th valign="top">Ingredient</td>



			<tr>
              			<td valign="top" style="width:50px">
                  		<input type=text name="Quantity[]" size="5"></td>
			</td>
			<td valign="top" style="width:75px"><input type=text name="Ingredients[]" size="25"></td></tr>
			<tr>
              			<td valign="top" style="width:50px">
                  		<input type=text name="Quantity[]" size="5"></td>
			</td>
			<td valign="top" style="width:75px"><input type=text name="Ingredients[]" size="25"></td></tr>
			<tr>
              			<td valign="top" style="width:50px">
                  		<input type=text name="Quantity[]" size="5"></td>
			</td>
			<td valign="top" style="width:75px"><input type=text name="Ingredients[]" size="25"></td></tr>









		</table>
<input type="button" value="Add a new row" onclick="addRow()">

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.