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
https://forums.phpfreaks.com/topic/141164-add-a-new-row-to-contact-page/
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()">

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.