So im trying to finish off my registration site and require two passwords like any other site. My verification wont work though. Ideally what I want is to have an alert when you change the second password saying they aren't the same or to continue if they are. I thought this function would have worked when i enter onchange="checkpass()" on the password2 input but nothing happens.
function checkpass(pass1,pass2)
{
pass1=document.txtpassword.value
pass2=document.txtpassword2.value
if (pass1 != pass2)
{
alert ("Passwords must match")
}
}
<form action="Home.html" method="post" name="form1" onsubmit="Display()">
<table bgcolor="white" width="700" border="0" align="center">
<col width="200">
<col width="200">
<tr>
<th colspan = "2" align = "center" bgcolor="grey"> Fill the form to sign up. </th>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>Forename</td>
<td>Surname</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtname" id="txtname" class="info" required>
<td><label>
<input type="text" name="txtsurname" id="txtsurname" class="info" required />
</label></td>
</tr>
<tr>
<td> Create Username</td>
<td> Birthday</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtusername" id="txtusername" class="info" required/>
</label></td>
<td><select name="DOBMonth" required>
<option value=""> Month </option>
<option value="January">January</option>
<option value="Febuary">Febuary</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select name="DOBDay" required>
<option value=""> Day </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="DOBYear" required>
<option value=""> Year </option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1998</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
<option value="1980">1980</option>
<option value="1979">1979</option>
<option value="1978">1978</option>
<option value="1977">1977</option>
<option value="1976">1976</option>
<option value="1975">1975</option>
<option value="1974">1974</option>
<option value="1973">1973</option>
<option value="1972">1972</option>
<option value="1971">1971</option>
<option value="1970">1970</option>
<option value="1969">1969</option>
<option value="1968">1968</option>
<option value="1967">1967</option>
<option value="1966">1966</option>
<option value="1965">1965</option>
<option value="1964">1964</option>
<option value="1963">1963</option>
<option value="1962">1962</option>
<option value="1961">1961</option>
<option value="1960">1960</option>
<option value="1959">1959</option>
<option value="1958">1958</option>
<option value="1957">1957</option>
<option value="1956">1956</option>
<option value="1955">1955</option>
<option value="1954">1954</option>
<option value="1953">1953</option>
<option value="1952">1952</option>
<option value="1951">1951</option>
<option value="1950">1950</option>
<option value="1949">1949</option>
<option value="1948">1948</option>
<option value="1947">1947</option>
</select>
<tr>
<td>Email</td>
<td>Confirm Email</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtemail" id="txtemail" class="info" onchange="ValidateEmail(txtemail)" required />
<td><label>
<input type="text" name="txtemail2" id="txtemail2" class="info" onchange="ValidateEmail2(txtemail2)" required/>
</label></td>
</tr>
<tr>
<td>Password</td>
<td>Confirm Pasword</td>
</tr>
<tr>
<td><label>
<input type="password" name="txtpassword" id="txtpassword" class="info" required/>
<td><label>
<input type="password" name="txtpassword2" id="txtpassword2" class="info" required/ onchange="checkpass(txtpassword,txtpassword2)">
</label></td>
</tr>
<td colspan="2" style="font-size:12px">**Passwords must be at least 8 characters in length.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td colspan="2">
<label>
<input type="checkbox" name="terms" value="terms" id="terms" required/>
I agree to the Terms and Conditions</label>
</td></tr>
<br><br><br>
<tr>
<td colspan="2"><label>
<input type="checkbox" name="notify" value="notify" id="notify" />
I want to receive notifications by text/email about new products in stock.</label>
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><label>
<input type="submit" name="Login" id="Login" value="Login"/>
</label></td>
<td><label>
<input type="reset" name="Reset" id="Reset" value="Reset" />
</label></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</form>
In your checkPass function, these objects are both undefined:
document.txtpassword
document.txtpassword2
When your function is run, the undefined objects will cause an error, which will be reported in the console. However, from the perspective of the UI, it will appear like nothing happened. Try this instead:
pass1=document.getElementById("txtpassword").value;
pass2=document.getElementById("txtpassword2").value;
For more information on getElementById: https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById
Related
UPDATE: so more accurately it seems the table cell appears and immediately disappears again?
UPDATE UPDATE: it works if I use onmousedown instead of onclick? But of course the second I release the mouse button it disappears again so that won't work either.
So I've searched around and can't seem to make this work. I'm simply trying to make a function so that when I click a button it changes the default display style for a table cell from none to show the cell.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="buildform.js" defer></script>
<link rel="stylesheet" href="main.css" />
<link rel="stylesheet" href="buildform.css" />
</head>
<body>
<form id="buildForm">
<table>
<colgroup>
<col />
<col />
<col />
</colgroup>
<tr>
<td colspan="3">Custom Computers Order Form</td>
</tr>
<tr>
<td><label>Operating System</label></td>
<td>
<select id="operatingSys" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="w7h" value="w7h">Windows 7 Home</option>
<option name="w7p" value="w7p">Windows 7 Professional</option>
<option name="w10h" value="w10h">Windows 10 Home</option>
<option name="w10p" value="w10p">Windows 10 Professional</option>
</select>
</td>
<td rowspan=2><label name="displayPrice" id="displayPrice">Display</label></td>
</tr>
<tr>
<td><label>Processor</label></td>
<td>
<select id="processors" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="ii3" value="i3">Intel i3</option>
<option name="ii5" value="i5">Intel i5</option>
<option name="ii7" value="i7">Intel i7</option>
</select>
</td>
</tr>
<tr>
<td><label>Motherboard</label></td>
<td>
<select id="motherboards" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="a" value="a">Motherboard a</option>
<option name="b" value="b">Motherboard a</option>
<option name="c" value="c">Motherboard a</option>
</select>
</td>
</tr>
<tr>
<td rowspan=4><label>RAM</label></td>
<td>
<select id="ram1" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="ii3" value="i3">Intel i3</option>
<option name="ii5" value="i5">Intel i5</option>
<option name="ii7" value="i7">Intel i7</option>
</select>
<button onclick="add()">Add More?</button>
</td>
</tr>
<tr>
<td id="hiddenRam1">
<select id="ram2" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="ii3" value="i3">Intel i3</option>
<option name="ii5" value="i5">Intel i5</option>
<option name="ii7" value="i7">Intel i7</option>
</select>
</td>
</tr>
<tr>
<td id="hiddenRam2">
<select id="ram3" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="ii3" value="i3">Intel i3</option>
<option name="ii5" value="i5">Intel i5</option>
<option name="ii7" value="i7">Intel i7</option>
</select>
</td>
</tr>
<tr>
<td id="hiddenRam3">
<select id="ram4" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="ii3" value="i3">Intel i3</option>
<option name="ii5" value="i5">Intel i5</option>
<option name="ii7" value="i7">Intel i7</option>
</select>
</td>
</tr>
<tr>
<td><label>Hard Drive</label></td>
<td>
<select id="hardrives" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="ssd128gb" value="ssd128gb">128 GB Corsair SSD</option>
<option name="ssd256gb" value="ssd256gb">256 GB Corsair SSD</option>
<option name="hdd500gb" value="hdd500gb">500 GB Western Digital HDD</option>
<option name="hdd1tb" value="hdd1tb">1 TB Western Digital HDD</option>
</select>
</td>
</tr>
<tr>
<td><label>Power Supply</label></td>
<td>
<select id="psus" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="300watt" value="300watt">300 Watt P/S</option>
<option name="400watt" value="400watt">400 Watt P/S</option>
<option name="500watt" value="500watt">500 Watt P/S</option>
<option name="600watt" value="600watt">600 Watt P/S</option>
<option name="700watt" value="700watt">700 Watt P/S</option>
</select>
</td>
</tr>
<tr>
<td><label>Case</label></td>
<td>
<select id="processors" onchange="buildTotal()">
<option name="none" value="none" selected>Select One</option>
<option name="case1" value="case1">Case 1</option>
<option name="case2" value="case2">Case 2</option>
<option name="case3" value="case3">Case 3</option>
</select>
</td>
</tr>
</table>
The javascript
function add() {
var x = document.getElementById("hidden");
x.style.display = "table-cell";
}
When someone clicks the 'Add More' button, the second select with options should show up. I have no idea what I'm doing wrong.
Nothing at all happens.
Try the following:
x.style.display = "table-cell"
I have a function for a registration page where if the data required isn't entered by the user then it alerts the user to fill it in. The form still submits the information though so not sure what I'm doing wrong. I want it to not submit until all data is submitted and correct.
function checkdetails()
{
if (document.form1.txtname.value == "")
{alert("Please fiill in your forename.");
}
if (document.form1.txtsurname.value == "")
{alert("Please fill in your surname.");
}
if (document.form1.txtusername == "")
{alert("Please create a username.");
}
if (document.form1.DOBDay.selectedIndex == 0)
{alert("Please select the day you were born.");
}
if (document.form1.DOBMonth.selectedIndex == 0)
{ alert("Please select the month you were born");
}
if (document.form1.DOBYear.selectedIndex == 0)
{alert("Please fill in the year you were born.");
}
if (document.form1.txtemail.value == "")
{alert("Please enter your e-mail address.");
}
if (document.form1.terms.checked == false)
{alert("Please tick that you have read the Terms and Conditions.");
}
}
<form action="Home.html" method="post" name="form1" onsubmit="Display()">
<table bgcolor="white" width="700" border="0" align="center">
<col width="200">
<col width="200">
<tr>
<th colspan = "2" align = "center" bgcolor="grey"> Fill the form to sign up. </th>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td colspan="2" style="font-size:12px">Fields marked with * are mandatory</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>Forename*</td>
<td>Surname*</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtname" id="txtname" class="info" />
<td><label>
<input type="text" name="txtsurname" id="txtsurname" class="info" />
</label></td>
</tr>
<tr>
<td> Create Username*</td>
<td> Birthday</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtusername" id="txtusername" class="info"/>
</label></td>
<td><select name="DOBMonth">
<option> Month </option>
<option value="January">January</option>
<option value="Febuary">Febuary</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select name="DOBDay">
<option> Day </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="DOBYear">
<option> Year </option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1998</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
<option value="1980">1980</option>
<option value="1979">1979</option>
<option value="1978">1978</option>
<option value="1977">1977</option>
<option value="1976">1976</option>
<option value="1975">1975</option>
<option value="1974">1974</option>
<option value="1973">1973</option>
<option value="1972">1972</option>
<option value="1971">1971</option>
<option value="1970">1970</option>
<option value="1969">1969</option>
<option value="1968">1968</option>
<option value="1967">1967</option>
<option value="1966">1966</option>
<option value="1965">1965</option>
<option value="1964">1964</option>
<option value="1963">1963</option>
<option value="1962">1962</option>
<option value="1961">1961</option>
<option value="1960">1960</option>
<option value="1959">1959</option>
<option value="1958">1958</option>
<option value="1957">1957</option>
<option value="1956">1956</option>
<option value="1955">1955</option>
<option value="1954">1954</option>
<option value="1953">1953</option>
<option value="1952">1952</option>
<option value="1951">1951</option>
<option value="1950">1950</option>
<option value="1949">1949</option>
<option value="1948">1948</option>
<option value="1947">1947</option>
</select>
<tr>
<td>Email*</td>
<td>Confirm Email*</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtemail" id="txtemail" class="info" onchange="ValidateEmail(txtemail)" />
<td><label>
<input type="text" name="txtemail2" id="txtemail2" class="info" onchange="ValidateEmail2(txtemail2)"/>
</label></td>
</tr>
<tr>
<td>Password*</td>
<td>Confirm Pasword*</td>
</tr>
<tr>
<td><label>
<input type="password" name="txtpassword" id="txtpassword" class="info"/>
<td><label>
<input type="password" name="txtpassword2" id="txtpassword2" class="info"/>
</label></td>
</tr>
<td colspan="2" style="font-size:12px">**Passwords must be at least 8 characters in lenght.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td colspan="2">
<label>
<input type="checkbox" name="terms" value="terms" id="terms" />
I agree to the Terms and Conditions</label>
</td></tr>
<br><br><br>
<tr>
<td colspan="2"><label>
<input type="checkbox" name="notify" value="notify" id="notify" />
I want to receive notifications by text/email about new products in stock.</label>
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><label>
<input type="submit" name="Login" id="Login" value="Login" onclick="checkdetails()" />
</label></td>
<td><label>
<input type="reset" name="Reset" id="Reset" value="Reset" />
</label></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</form>
it's better to use html5 attribute required !
<input type="text" name="input" required >
return false; should prevent it from performing it's action.
<form name="testForm" onsubmit="return validate();">
<script type="text/javascript">
function validate()
{
if(check if your conditions are not satisfying)
{
alert("validation failed false");
returnToPreviousPage();
return false;
}
alert("validations passed");
return true;
}
</script>
However, as stated in answer above, html5 required attribute is best practice. You will need to consider more than just empty fields though. For example, will need to regex check your email field, etc.
http://www.html5-tutorials.org/form-validation/validating-email/
I need to make my drop down menu a required field when signing up for a page. I done the same to my drop down menu that I done for text boxes and a check box which are all working so cant understand why the drop down isn't. This is the whole form I have with the others done. Thanks
<form action="Home.html" method="post" name="form1" onsubmit="Display()">
<table bgcolor="white" width="700" border="0" align="center">
<col width="200">
<col width="200">
<tr>
<th colspan = "2" align = "center" bgcolor="grey"> Fill the form to sign up. </th>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td colspan="2" style="font-size:12px">Fields marked with * are mandatory</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>Forename*</td>
<td>Surname*</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtname" id="txtname" class="info" required>
<td><label>
<input type="text" name="txtsurname" id="txtsurname" class="info" required />
</label></td>
</tr>
<tr>
<td> Create Username*</td>
<td> Birthday</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtusername" id="txtusername" class="info" required/>
</label></td>
<td><select name="DOBMonth" required>
<option> Month </option>
<option value="January">January</option>
<option value="Febuary">Febuary</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select name="DOBDay" required>
<option> Day </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="DOBYear" required>
<option> Year </option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1998</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
<option value="1980">1980</option>
<option value="1979">1979</option>
<option value="1978">1978</option>
<option value="1977">1977</option>
<option value="1976">1976</option>
<option value="1975">1975</option>
<option value="1974">1974</option>
<option value="1973">1973</option>
<option value="1972">1972</option>
<option value="1971">1971</option>
<option value="1970">1970</option>
<option value="1969">1969</option>
<option value="1968">1968</option>
<option value="1967">1967</option>
<option value="1966">1966</option>
<option value="1965">1965</option>
<option value="1964">1964</option>
<option value="1963">1963</option>
<option value="1962">1962</option>
<option value="1961">1961</option>
<option value="1960">1960</option>
<option value="1959">1959</option>
<option value="1958">1958</option>
<option value="1957">1957</option>
<option value="1956">1956</option>
<option value="1955">1955</option>
<option value="1954">1954</option>
<option value="1953">1953</option>
<option value="1952">1952</option>
<option value="1951">1951</option>
<option value="1950">1950</option>
<option value="1949">1949</option>
<option value="1948">1948</option>
<option value="1947">1947</option>
</select>
<tr>
<td>Email*</td>
<td>Confirm Email*</td>
</tr>
<tr>
<td><label>
<input type="text" name="txtemail" id="txtemail" class="info" onchange="ValidateEmail(txtemail)" required />
<td><label>
<input type="text" name="txtemail2" id="txtemail2" class="info" onchange="ValidateEmail2(txtemail2)" required/>
</label></td>
</tr>
<tr>
<td>Password*</td>
<td>Confirm Pasword*</td>
</tr>
<tr>
<td><label>
<input type="password" name="txtpassword" id="txtpassword" class="info" required/>
<td><label>
<input type="password" name="txtpassword2" id="txtpassword2" class="info" required/>
</label></td>
</tr>
<td colspan="2" style="font-size:12px">**Passwords must be at least 8 characters in lenght.</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td colspan="2">
<label>
<input type="checkbox" name="terms" value="terms" id="terms" required/>
I agree to the Terms and Conditions</label>
</td></tr>
<br><br><br>
<tr>
<td colspan="2"><label>
<input type="checkbox" name="notify" value="notify" id="notify" />
I want to receive notifications by text/email about new products in stock.</label>
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><label>
<input type="submit" name="Login" id="Login" value="Login" onclick="checkdetails() " />
</label></td>
<td><label>
<input type="reset" name="Reset" id="Reset" value="Reset" />
</label></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</form>
It seems you need to add the value="" to your default answers. For example, this should do the trick for your "DOBMonth" dropdown:
<select name="DOBMonth" required>
<option value=""> Month </option>
<option value="January">January</option>
<option value="Febuary">Febuary</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
I want to iterate through multiple select options in a specific div via Jquery each function. And after that if there is atleast one empty field, the loop breaks and set 0 to reqCourseFlag variable.My implementation is below but it does not looping through
HTML:
<div id="IENG349ReqCourses" class="reqCourses">
<center>
<table>
<caption style="color:#f00;">Please select your grades for required courses.</caption>
<tr>
<td valign="middle">
<label>IENG 102 - Intro to IE:</label>
</td>
<td>
<select id="intershipTypeBox" name="IENG102Grade">
<option value="">--select--</option>
<option value="NOT TAKEN">NOT TAKEN</option>
<option value="TAKING">TAKING</option>
<option value="A">A</option>
<option value="A-">A-</option>
<option value="B+">B+</option>
<option value="B">B</option>
<option value="B-">B-</option>
<option value="C+">C+</option>
<option value="C">C</option>
<option value="F">F</option>
</select>
</td>
</tr>
<tr>
<td valign="middle">
<label>IENG104 - Comp. Aided Drawing:</label>
</td>
<td>
<select id="intershipTypeBox" name="IENG104Grade">
<option value="">--select--</option>
<option value="NOT TAKEN">NOT TAKEN</option>
<option value="TAKING">TAKING</option>
<option value="A">A</option>
<option value="A-">A-</option>
<option value="B+">B+</option>
<option value="B">B</option>
<option value="B-">B-</option>
<option value="C+">C+</option>
<option value="C">C</option>
<option value="F">F</option>
</select>
</td>
</tr>
<tr>
<td valign="middle">
<label>IENG 211 - Prob. In Eng.:</label>
</td>
<td>
<select id="intershipTypeBox" name="IENG211Grade">
<option value="">--select--</option>
<option value="NOT TAKEN">NOT TAKEN</option>
<option value="TAKING">TAKING</option>
<option value="A">A</option>
<option value="A-">A-</option>
<option value="B+">B+</option>
<option value="B">B</option>
<option value="B-">B-</option>
<option value="C+">C+</option>
<option value="C">C</option>
<option value="F">F</option>
</select>
</td>
</tr>
<tr>
<td valign="middle">
<label>IENG 212 - Eng. Statistics:</label>
</td>
<td>
<select id="intershipTypeBox" name="IENG212Grade">
<option value="">--select--</option>
<option value="NOT TAKEN">NOT TAKEN</option>
<option value="TAKING">TAKING</option>
<option value="A">A</option>
<option value="A-">A-</option>
<option value="B+">B+</option>
<option value="B">B</option>
<option value="B-">B-</option>
<option value="C+">C+</option>
<option value="C">C</option>
<option value="F">F</option>
</select>
</td>
</tr>
<tr>
<td valign="middle">
<label>IENG 221 - Work Syst. Analysis and Design:</label>
</td>
<td>
<select id="intershipTypeBox" name="IENG221Grade">
<option value="">--select--</option>
<option value="NOT TAKEN">NOT TAKEN</option>
<option value="TAKING">TAKING</option>
<option value="A">A</option>
<option value="A-">A-</option>
<option value="B+">B+</option>
<option value="B">B</option>
<option value="B-">B-</option>
<option value="C+">C+</option>
<option value="C">C</option>
<option value="F">F</option>
</select>
</td>
</tr>
</table>
</center>
</div>
$('div.#IENG349ReqCourses: select> option:selected').each(function() {
var value = $(this).val();
if(value === ""){
reqCourseFlag = 0;
return false;
}
});
Any help would be appriciated.
Your selector is incorrect, you don't need the . or the :
$('div#IENG349ReqCourses select> option:selected').each(function () {
demo http://jsfiddle.net/Xr5LL/
The first script that you see does not work because the "tr" element that includes "t1_t2_c_p_addressBook_input_txbCompanyName" does not have an assigned ID.
The second script does work because there is a "tr" element "t1_t2_c_p_addressBook_input_txbFirstName" with an assigned ID of "t1_t2_c_p_addressBook_input_rowFirstName". How can I make the first script to work? I can not alter the elements or the IDs of the elements. I can only insert one script that will allow me to override. This is part of an e-commerce platform where I can only control the HTML template and add custom messages to different pages. The script would be added in a custom message on the Shipping page of the checkout process.
In other words, I need to make the text input field (that I can't control) that has the ID of "t1_t2_c_p_addressBook_input_txbCompanyName" required without using any "tr" stuff.
$(document).ready(function () {
var $companyname = $('#t1_t2_c_p_addressBook_input_txbCompanyName');
$companyname.parent('td').prev('td').prepend('<span style="color: Red;">*</span>');
$('input#t1_t2_c_p_addressBook_input_btnSave').click(function (e) {
if($companyname.val().length < 1) {
e.preventDefault();
$('span#mainContent').parent().prepend('<div class="MessageBox" id="t1_t2_c_vs" <img align="left" src="/Images/icoExclamation.gif">Please correct the following:<ul><li>Company Name is a required field</li></ul></div>');
}
});
});
$(document).ready(function () {
var $firstname = $('#t1_t2_c_p_addressBook_input_rowFirstName td.valueCell input');
$firstname.parent('td').prev('td').prepend('<span style="color: Red;">*</span>');
$('input#t1_t2_c_p_addressBook_input_btnSave').click(function (e) {
if($firstname.val().length < 1) {
e.preventDefault();
$('span#mainContent').parent().prepend('<div class="MessageBox" id="t1_t2_c_vs" <img align="left" src="/Images/icoExclamation.gif">Please correct the following:<ul><li>First Name is a required field</li></ul></div>');
}
});
});
Here is all of the HTML. This particular piece of HTML is generated dynamically by the web application.
<div id="t1_t2_c_p_addressBook_pnlEdit" style="padding:4px;width:505px;margin-top:1em;">
<span id="t1_t2_c_p_addressBook_input_lblHeading" style="font-weight:bold;">Create a New Shipping Address:</span>
<div>
<span id="" style="color:Red;">*</span><span style="font-size:8pt;"> = required field</span>
</div>
<table id="t1_t2_c_p_addressBook_input_tblAddress" cellspacing="0" cellpadding="2" border="0" style="border-collapse:collapse;">
<tr id="t1_t2_c_p_addressBook_input_rowAddressName">
<td class="labelCell" valign="top">
Address Name:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbAddressName" type="text" id="t1_t2_c_p_addressBook_input_txbAddressName" style="width:286px;"/>
<img src="/Images/help.gif" border="0" style="height:16px;width:16px;"/>
<div class="HelpPopup" style="width:400px;visibility:hidden;position:absolute;z-index:999;background:white;">
Examples: Work, Home
</div>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowFirstName">
<td class="labelCell" valign="top">
First Name:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="firstNameReq" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbFname" type="text" id="t1_t2_c_p_addressBook_input_txbFname" style="width:286px;"/>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowLastName">
<td class="labelCell" valign="top">
Last Name:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="lastNameReq" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbLname" type="text" id="t1_t2_c_p_addressBook_input_txbLname" style="width:286px;"/>
</td>
</tr>
<tr>
<td class="labelCell" valign="top">
Company Name:
</td>
<td align="right" valign="top" style="width:6px;">
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbCompanyName" type="text" id="t1_t2_c_p_addressBook_input_txbCompanyName" style="width:286px;"/>
</td>
</tr>
<tr>
<td class="labelCell" valign="top">
Address Line 1:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbStreet1" type="text" id="t1_t2_c_p_addressBook_input_txbStreet1" style="width:286px;"/>
</td>
</tr>
<tr>
<td class="labelCell" valign="top">
Address Line 2:
</td>
<td align="right" valign="top" style="width:6px;">
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbStreet2" type="text" id="t1_t2_c_p_addressBook_input_txbStreet2" style="width:286px;"/>
</td>
</tr>
<tr>
<td class="labelCell" valign="top">
City:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbCity" type="text" id="t1_t2_c_p_addressBook_input_txbCity" style="width:286px;"/>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowStateRegion">
<td class="labelCell" valign="top">
State/Region/Province:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="stateReq" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<select name="t1:t2:c:p:addressBook:input:ddlState" id="t1_t2_c_p_addressBook_input_ddlState">
<option selected="selected" value=""></option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
<option value="AA">Armed Forces Americas (AA)</option>
<option value="AE">Armed Forces Africa/Canada/Europe/Middle East (AE)</option>
<option value="AP">Armed Forces Pacific (AP)</option>
<option value="AS">American Samoa</option>
<option value="FM">Federated States of Micronesia</option>
<option value="GU">Guam</option>
<option value="MH">Marshall Islands</option>
<option value="MP">Northern Mariana Islands</option>
<option value="PW">Palau</option>
<option value="PR">Puerto Rico</option>
<option value="VI">Virgin Islands</option>
</select>
<select name="t1:t2:c:p:addressBook:input:ddlStateDutch" id="t1_t2_c_p_addressBook_input_ddlStateDutch">
<option selected="selected" value=""></option>
<option value="Drenthe">Drenthe</option>
<option value="Flevoland">Flevoland</option>
<option value="Friesland">Friesland</option>
<option value="Gelderland">Gelderland</option>
<option value="Groningen">Groningen</option>
<option value="Limburg">Limburg</option>
<option value="Noord-Brabant">Noord-Brabant</option>
<option value="Noord-Holland">Noord-Holland</option>
<option value="Overijssel">Overijssel</option>
<option value="Utrecht">Utrecht</option>
<option value="Zeeland">Zeeland</option>
<option value="Zuid-Holland">Zuid-Holland</option>
</select>
<select name="t1:t2:c:p:addressBook:input:ddlStateCA" id="t1_t2_c_p_addressBook_input_ddlStateCA">
<option selected="selected" value=""></option>
<option value="AB">Alberta</option>
<option value="BC">British Columbia</option>
<option value="MB">Manitoba</option>
<option value="NB">New Brunswick</option>
<option value="NL">Newfoundland and Labrador</option>
<option value="NT">Northwest Territories</option>
<option value="NS">Nova Scotia</option>
<option value="NU">Nunavut</option>
<option value="ON">Ontario</option>
<option value="PE">Prince Edward Island</option>
<option value="QC">Quebec</option>
<option value="SK">Saskatchewan</option>
<option value="YT">Yukon</option>
</select>
<input name="t1:t2:c:p:addressBook:input:txbStateAlt" type="text" id="t1_t2_c_p_addressBook_input_txbStateAlt"/>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowZipCode">
<td class="labelCell" valign="top">
Zip/Postal Code:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="zipRequired" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbZip" type="text" id="t1_t2_c_p_addressBook_input_txbZip" style="width:286px;"/>
</td>
</tr>
<tr>
<td class="labelCell" valign="top">
Country:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<select name="t1:t2:c:p:addressBook:input:ddlCountry" id="t1_t2_c_p_addressBook_input_ddlCountry" onchange="$451.setRequiredFields();">
<option selected="selected" value="US">United States of America</option>
<option value="AF">Afghanistan</option>
<option value="AX">Ă…land Islands</option>
<option value="AL">Albania</option>
<option value="DZ">Algeria</option>
<option value="AS">American Samoa</option>
<option value="AD">Andorra</option>
<option value="AO">Angola</option>
<option value="AI">Anguilla</option>
<option value="AQ">Antarctica</option>
<option value="AG">Antigua and Barbuda</option>
<option value="AR">Argentina</option>
<option value="AM">Armenia</option>
<option value="AW">Aruba</option>
<option value="AU">Australia</option>
<option value="AT">Austria</option>
<option value="AZ">Azerbaijan</option>
<option value="BS">Bahamas</option>
<option value="BH">Bahrain</option>
<option value="BD">Bangladesh</option>
<option value="BB">Barbados</option>
<option value="BY">Belarus</option>
<option value="BE">Belgium</option>
<option value="BZ">Belize</option>
<option value="BJ">Benin</option>
<option value="BM">Bermuda</option>
<option value="BT">Bhutan</option>
<option value="BO">Bolivia</option>
<option value="BA">Bosnia and Herzegovina</option>
<option value="BW">Botswana</option>
<option value="BV">Bouvet Island</option>
<option value="BR">Brazil</option>
<option value="IO">British Indian Ocean Territory</option>
<option value="BN">Brunei Darussalam</option>
<option value="BG">Bulgaria</option>
<option value="BF">Burkina Faso</option>
<option value="BI">Burundi</option>
<option value="KH">Cambodia</option>
<option value="CM">Cameroon</option>
<option value="CA">Canada</option>
<option value="CV">Cape Verde</option>
<option value="KY">Cayman Islands</option>
<option value="CF">Central African Republic</option>
<option value="TD">Chad</option>
<option value="CL">Chile</option>
<option value="CN">China</option>
<option value="CX">Christmas Island Australia</option>
<option value="CC">Cocos Keeling Islands</option>
<option value="CO">Colombia</option>
<option value="KM">Comoros</option>
<option value="CG">Congo</option>
<option value="CD">Congo, D.R.</option>
<option value="CK">Cook Islands</option>
<option value="CR">Costa Rica</option>
<option value="CI">Cote D'Ivoire Ivory Coast</option>
<option value="HR">Croatia Hrvatska</option>
<option value="CU">Cuba</option>
<option value="BY">Cyprus</option>
<option value="CZ">Czech Republic</option>
<option value="DK">Denmark</option>
<option value="DJ">Djibouti</option>
<option value="DM">Dominica</option>
<option value="DO">Dominican Republic</option>
<option value="EC">Ecuador</option>
<option value="EG">Egypt</option>
<option value="SV">El Salvador</option>
<option value="GQ">Equatorial Guinea</option>
<option value="ER">Eritrea</option>
<option value="EE">Estonia</option>
<option value="ET">Ethiopia</option>
<option value="FO">Faeroe Islands</option>
<option value="FK">Falkland Islands Malvinas</option>
<option value="FJ">Fiji</option>
<option value="FI">Finland</option>
<option value="FR">France</option>
<option value="FX">France, Metropolitan</option>
<option value="GF">French Guiana</option>
<option value="PF">French Polynesia</option>
<option value="TF">French Southern Territories</option>
<option value="GA">Gabon</option>
<option value="GM">Gambia</option>
<option value="GE">Georgia</option>
<option value="DE">Germany</option>
<option value="GH">Ghana</option>
<option value="GI">Gibraltar</option>
<option value="GR">Greece</option>
<option value="GL">Greenland</option>
<option value="GD">Grenada</option>
<option value="GP">Guadeloupe</option>
<option value="GU">Guam</option>
<option value="GT">Guatemala</option>
<option value="GN">Guinea</option>
<option value="GW">Guinea Bissau</option>
<option value="GY">Guyana</option>
<option value="HT">Haiti</option>
<option value="HM">Heard and McDonald Is.</option>
<option value="HN">Honduras</option>
<option value="HK">Hong Kong</option>
<option value="HU">Hungary</option>
<option value="IS">Iceland</option>
<option value="IN">India</option>
<option value="ID">Indonesia</option>
<option value="IR">Iran</option>
<option value="IQ">Iraq</option>
<option value="IM">Isle of Man</option>
<option value="IE">Ireland</option>
<option value="IL">Israel</option>
<option value="IT">Italy</option>
<option value="JM">Jamaica</option>
<option value="JP">Japan</option>
<option value="JE">Jersey</option>
<option value="JO">Jordan</option>
<option value="KZ">Kazakhstan</option>
<option value="KE">Kenya</option>
<option value="KI">Kiribati</option>
<option value="KP">Korea North</option>
<option value="KR">Korea South</option>
<option value="KW">Kuwait</option>
<option value="KG">Kyrgyzstan</option>
<option value="LA">Lao P.Dem.R.</option>
<option value="LV">Latvia</option>
<option value="LB">Lebanon</option>
<option value="LS">Lesotho</option>
<option value="LR">Liberia</option>
<option value="LY">Libyan Arab Jamahiriya</option>
<option value="LI">Liechtenstein</option>
<option value="LT">Lithuania</option>
<option value="LU">Luxembourg</option>
<option value="MO">Macau</option>
<option value="MK">Macedonia</option>
<option value="MG">Madagascar</option>
<option value="MW">Malawi</option>
<option value="MY">Malaysia</option>
<option value="MV">Maldives</option>
<option value="ML">Mali</option>
<option value="MT">Malta</option>
<option value="MH">Marshall Islands</option>
<option value="MQ">Martinique</option>
<option value="MR">Mauritania</option>
<option value="MU">Mauritius</option>
<option value="YT">Mayotte</option>
<option value="MX">Mexico</option>
<option value="FM">Micronesia</option>
<option value="MD">Moldova</option>
<option value="MC">Monaco</option>
<option value="MN">Mongolia</option>
<option value="ME">Montenegro</option>
<option value="MS">Montserrat</option>
<option value="MA">Morocco</option>
<option value="MZ">Mozambique</option>
<option value="MM">Myanmar</option>
<option value="NA">Namibia</option>
<option value="NR">Nauru</option>
<option value="NP">Nepal</option>
<option value="NL">Netherlands</option>
<option value="AN">Netherlands Antilles</option>
<option value="NC">New Caledonia</option>
<option value="NZ">New Zealand</option>
<option value="NI">Nicaragua</option>
<option value="NE">Niger</option>
<option value="NG">Nigeria</option>
<option value="NU">Niue</option>
<option value="NF">Norfolk Island</option>
<option value="MP">Northern Mariana Islands</option>
<option value="NO">Norway</option>
<option value="OM">Oman</option>
<option value="PK">Pakistan</option>
<option value="PW">Palau</option>
<option value="PS">Palestinian Territory, Occupied</option>
<option value="PA">Panama</option>
<option value="PG">Papua New Guinea</option>
<option value="PY">Paraguay</option>
<option value="PE">Peru</option>
<option value="PH">Philippines</option>
<option value="PN">Pitcairn</option>
<option value="PL">Poland</option>
<option value="PT">Portugal</option>
<option value="PR">Puerto Rico</option>
<option value="QA">Qatar</option>
<option value="RE">Reunion</option>
<option value="RO">Romania</option>
<option value="RU">Russian Federation</option>
<option value="RW">Rwanda</option>
<option value="SH">Saint Helena</option>
<option value="KN">Saint Kitts and Nevis</option>
<option value="LC">Saint Lucia</option>
<option value="PM">Saint Pierre and Miquelon</option>
<option value="VC">Saint Vincent and the Grenadines</option>
<option value="WS">Samoa</option>
<option value="SM">San Marino</option>
<option value="ST">Sao Tome and Principe</option>
<option value="SA">Saudi Arabia</option>
<option value="SN">Senegal</option>
<option value="RS">Serbia</option>
<option value="SC">Seychelles</option>
<option value="SL">Sierra Leone</option>
<option value="SG">Singapore</option>
<option value="SK">Slovakia</option>
<option value="SI">Slovenia</option>
<option value="SB">Solomon Islands</option>
<option value="SO">Somalia</option>
<option value="ZA">South Africa</option>
<option value="GS">S. Georgia & S. Sandwich Is.</option>
<option value="ES">Spain</option>
<option value="LK">Sri Lanka</option>
<option value="SD">Sudan</option>
<option value="SR">Suriname</option>
<option value="SJ">Svalbard & Jan Mayen Is.</option>
<option value="SZ">Swaziland</option>
<option value="SE">Sweden</option>
<option value="CH">Switzerland</option>
<option value="SY">Syrian Arab Rep.</option>
<option value="TW">Taiwan</option>
<option value="TJ">Tajikistan</option>
<option value="TZ">Tanzania</option>
<option value="TH">Thailand</option>
<option value="TG">Timor-Leste</option>
<option value="TG">Togo</option>
<option value="TK">Tokelau</option>
<option value="TO">Tonga</option>
<option value="TT">Trinidad and Tobago</option>
<option value="TN">Tunisia</option>
<option value="TR">Turkey</option>
<option value="TM">Turkmenistan</option>
<option value="TC">Turks and Caicos Islands</option>
<option value="TU">Tuvalu</option>
<option value="UG">Uganda</option>
<option value="UA">Ukraine</option>
<option value="GB">United Kingdom</option>
<option value="AE">United Arab Emirates</option>
<option value="UM">US Minor Outlying Is.</option>
<option value="UY">Uruguay</option>
<option value="UZ">Uzbekistan</option>
<option value="VU">Vanuatu</option>
<option value="VC">Vatican City State</option>
<option value="VE">Venezuela</option>
<option value="VN">Viet Nam</option>
<option value="VG">Virgin Islands British</option>
<option value="VI">Virgin Islands US</option>
<option value="WF">Wallis and Futuna Islands</option>
<option value="EH">Western Sahara</option>
<option value="YE">Yemen</option>
<option value="YU">Yugoslavia</option>
<option value="ZM">Zambia</option>
<option value="ZW">Zimbabwe</option>
</select>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowPhone">
<td class="labelCell" valign="top">
Phone:
</td>
<td align="right" valign="top" style="width:6px;">
<span id="phoneReq" style="color:Red;">*</span>
</td>
<td class="valueCell" valign="bottom">
<input name="t1:t2:c:p:addressBook:input:txbPhone" type="text" id="t1_t2_c_p_addressBook_input_txbPhone" style="width:286px;"/>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowBilling">
<td colspan="3">
<input id="t1_t2_c_p_addressBook_input_cxbBilling" type="checkbox" name="t1:t2:c:p:addressBook:input:cxbBilling" onclick="$451.setRequiredFields();"/><label for="t1_t2_c_p_addressBook_input_cxbBilling">Save to Billing Address Book</label>
</td>
</tr>
<tr id="t1_t2_c_p_addressBook_input_rowAdditionalFields">
<td colspan="3">
</td>
</tr>
</table>
</div>