Hi guys,

This is my first post here, just letting you know now that javascript isn't my

programming language of choice however for my current project i need to include a

lengthy form and javascript will be the best option to keep the form compact.

I have a form (included below) in its most basic form. The user is expected to

setup a master account and then if they wish, they can setup other accounts for

separate departments by clicking the '+ Department' button.

When the '+ Department' button is clicked i need the text fields below to popup

with unique id's.

The extra fields are, department name, address, tab one, tab two, unique key


Form:
Code:
<form action="<?php $_SERVER['PHP_SELF']; ?>" method="post" name="reg">
						<p>Your Name <span 

class="style1">*</span> 
		                  <input name="name" type="text" />
		                  <br />
		                  <br />
						Company Name <span 

class="style1">*</span> 
		                <input name="cname" type="text" />
		                <br />
		                <br />
						Address Line 1 <span 

class="style1">*</span> 
		                <input name="ad1" type="text" />
		                <br />
		                <br />
						Address Line2 <span 

class="style1">*</span> 
		                <input name="ad2" type="text" />
		                <br />
		                <br />
						 Email <span 

class="style1">*</span> 
		                 <input name="email" type="text" />
		                 <br />
		                 <br />
						Telephone <span 

class="style1">*</span> 
		                <input name="tel" type="text" />
		                <br />
		                <br />
						 Fax 
						 <input name="fax" type="text" />
						 <br />
						 <br />
						Invoice Address Line 1 (If 

different to above) 
						<input name="invoicead1" 

type="text" />
						<br />
						<br />
						Invoice Address Line 2 
						<input name="invoicead2" 

type="text" />
						<br />
						<br />
						Order No 
						<input name="orderno" type="text" 

/>
						<br />
		                <br />
		  Main Site Details<span class="style1">*</span> 
          <input name="site1" type="text" />
		  <br />
		  <br />
						Address of Site/s <span 

class="style1">*</span> 
		                <textarea name="sitead1" cols="" 

rows=""></textarea>
		                <br />
		                <br /> 
		                <textarea name="sitead2" cols="" 

rows=""></textarea>
		                <br />
		                <br /> 
		                <textarea name="sitead3" cols="" 

rows=""></textarea>
		                <br />
		                <br />
						Title your Tab/s <span 

class="style1">*</span> 
		                <textarea name="tabnames" cols="" 

rows=""></textarea>
          </p>
						<p>Sitename <span 

class="style1">*</span>
                          <input name="username" type="text" />
                          <br />
                          <br />
                          Password<span class="style1">*</span>
                          <input name="password1" type="text" />
</p>
						<p>Confirm Password <span 

class="style1">*</span>
                          <input name="password2" type="text" />
</p>
						<p>
						  <label>
						  <input type="submit" 

name="addsub" id="addsub" value="+ Department" />
						  </label>
						  <br />
		                  <br />
						I have viewed and agreed the terms 

and conditions of sale <span class="style1">*</span> 
		                <input name="accept" type="checkbox" value="y" />
		                <br />
		                <br />
						<input name="Submit" type="button" 

value="Submit" />
						<br />
						<br />
						<span class="style1">*</span> 

<span class="style1">Required Fields</span>		                           

   </p>
		</form>
I have obtained some javascript which has basic functionality but having no js

experience i really need some help in modifying the script to add the new text

fields and set them up with a unique id.

JS:
Code:
function addField() {
var tbody = document.getElementById("tblBody");
var ctr = tbody.getElementsByTagName("input").length + 1;
var input;

if ( ctr > 15 ) {
alert ("15 is the maximum amount of orders you are allowed.");
}else{

if (document.all){ //input.name doesn't work in IE
input = document.createElement('<input name="field_'+ctr+'">');
}else{
input = document.createElement('input');
input.name = "field_"+ctr;
}

input.id = input.name;
input.type = "text";
input.value = "";
input.className = "textfield";
var cell = document.createElement('td');
cell.style.height = '30px';
cell.appendChild(document.createTextNode(ctr+". "));
cell.appendChild(input);
var row = document.createElement('tr');
row.appendChild(cell);
tbody.appendChild(row);

window.document.the_form.count.value = ctr;

}
}
Thanks for any help supplied, anything will be really helpful to me.