Part of the page the code works on:
Code: Select all
<fieldset>
<legend>Guest List</legend>
<div id="guestList">
<!--<input type="button" name="regEdit" id="regEdit" value="edit" onclick="javascript:history.go(-1)"/>
-->
<div id="guestForm1" class="guestForm">
<h4>Guest 1</h4>
<table>
<tr><td>
<label for="Guests[guest1][First]">First Name*:</label> </td><td>
<input type="text" name="Guests[guest1][First]" id="Guests[guest1][First]" size="20"/><br /></td><td>
<label for="Guests[guest1][Last]">Last Name*:</label> </td><td>
<input type="text" name="Guests[guest1][Last]" id="Guests[guest1][Last]" class="nochange" size="20" /><br /></td></tr>
<tr><td>
<label for="Guests[guest1][Email]">E-mail*:</label></td><td>
<input type="text" name="Guests[guest1][Email]" id="Guests[guest1][Email]" class="nochange" size="20" /><br /></td><td>
<label for="Guests[guest1][m]">YLS Member:</label> </td><td>
<input type="checkbox" name="Guests[guest1][m]" id="Guests[guest1][m]" value="true" checked="checked"/></td></tr>
</table>
</div>
</div>
<input type="button" name="addGuest" value="Add a Guest" onClick="addOne()"/> <input type="button" name="minGuest" value="Remove Last Guest" onClick ="takeOne()" id="take"/>
</fieldset>Code: Select all
function addOne(){
//up the guest count
gnum += 1;
//make the new names/ids/fors
var form = 'guestForm'+gnum;
var first = "Guests[guest"+gnum+"][First]";
var last = "Guests[guest"+gnum+"][Last]";
var email = "Guests[guest"+gnum+"][Email]";
var member = "Guests[guest"+gnum+"][m]";
/*add a set of fields for a guest*/
//clone a guest form div
var newGuest = document.getElementById('guestForm1').cloneNode(true);
newGuest.setAttribute('id', form);
//set the new title
newGuest.getElementsByTagName('h4')[0].firstChild.nodeValue='Guest '+gnum;
//set the new labels and Id's
newGuest.getElementsByTagName('label')[0].for = first;
newGuest.getElementsByTagName('input')[0].id = first;
newGuest.getElementsByTagName('input')[0].name = first;
newGuest.getElementsByTagName('input')[0].value = "";
newGuest.getElementsByTagName('input')[0].readonly = "";
newGuest.getElementsByTagName('input')[0].class = "changeme";
newGuest.getElementsByTagName('label')[1].for = last;
newGuest.getElementsByTagName('input')[1].id = last;
newGuest.getElementsByTagName('input')[1].name = last;
newGuest.getElementsByTagName('input')[1].value = "";
newGuest.getElementsByTagName('input')[1].readonly = "";
newGuest.getElementsByTagName('input')[1].class = "changeme";
newGuest.getElementsByTagName('label')[2].for = email;
newGuest.getElementsByTagName('input')[2].id = email;
newGuest.getElementsByTagName('input')[2].name = email;
newGuest.getElementsByTagName('input')[2].value = "";
newGuest.getElementsByTagName('input')[2].readonly = "";
newGuest.getElementsByTagName('input')[2].class = "changeme";
newGuest.getElementsByTagName('label')[3].for = member;
newGuest.getElementsByTagName('input')[3].id = member;
newGuest.getElementsByTagName('input')[3].name = member;
newGuest.getElementsByTagName('input')[3].checked = "";
newGuest.getElementsByTagName('input')[3].readonly = "";
newGuest.getElementsByTagName('input')[3].class = "changeme";
//append the guest form div
document.getElementById('guestList').appendChild(newGuest);
//update the fee
//document.getElementById('total').value = calDue();
//show take one button
document.getElementById('take').style.display = 'inline';
}