How to total up all drop down menu - javascript

I need help I'm new to this but I have 3 dropdown menus how would count them and total them all up to prompt the user if the total of the dropdowns is more then 10 in total:
I have added the code I'm using below:
<table align="center" width="360" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="270" align="right">N1:</td>
<td width="270" align="right">
<select name="N1" id="N1">
<option value="0">0</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>
</select>
</td>
<td width="270" align="right">N2:</td>
<td width="270" align="right">
<select name="N2" id="N2">
<option value="0">0</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>
</select>
</td>
</tr>
<td width="370" align="right">N3:</td>
<td width="270" align="right">
<select name="N3" id="N3">
<option value="0">0</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>
</td>
</tr>
</table>

Attach the change event to all the three select's, then on change loop through the select's you've and calculate the total sum of the selected value, like :
$('select').each(function() {
total += Number($(this).val());
});
Code:
$('select').on('change', function() {
var total = 0;
$('select').each(function() {
total += Number($(this).val());
});
console.log(total);
if (total > 10) {
console.log('Alert user');
}
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table align="center" width="360" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="270" align="right">N1:</td>
<td width="270" align="right">
<select name="N1" id="N1">
<option value="0">0</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>
</select>
</td>
<td width="270" align="right">N2:</td>
<td width="270" align="right">
<select name="N2" id="N2">
<option value="0">0</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>
</select>
</td>
<td width="370" align="right">N3:</td>
<td width="270" align="right">
<select name="N3" id="N3">
<option value="0">0</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>
</select>
</td>
</tr>
</table>

Related

Don't submit unless all data is entered

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/

Javascript password validation wont work

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

Jquery: How to disable siblings dropdown value across <TR>

i have a table like this:
<table class="mytable">
<tr>
<td>
<select class="go">
<option value="">--</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>
</select>
</td>
</tr>
<tr>
<td>
<select class="go">
<option value="">--</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>
</select>
</td>
</tr>
<tr>
<td>
<select class="go">
<option value="">--</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>
</select>
</td>
</tr>
<tr>
<td>
<select class="go">
<option value="">--</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>
</select>
</td>
</tr>
<tr>
<td>
<select class="go">
<option value="">--</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>
</select>
</td>
</tr>
</table>
and my jquery code like this:
$(".go").change(function(){
var selVal=[];
$(".go").each(function(){
selVal.push(this.value);
});
$(this).closest('tr').siblings(".go").find("option").removeAttr("disabled").filter(function(){
var a=$(this).parent("select").val();
return (($.inArray(this.value, selVal) > -1) && (this.value!=a))
}).attr("disabled","disabled");
});
My Fiddle
How do i disable siblings value if i select 1 on this dropdown, but i should not able to select the 1 on another dropdown again. Here is the working example that work perfectly without table/td/. My requirement come across to use table tr/td. I tried to use: $(this).closest('tr').siblings(".go")
but its not working. any idea?
Try passing tr to .siblings()
$(this).closest("tr").siblings("tr").find("option")
jsfiddle http://jsfiddle.net/ev5qvprv/122/
you can do this by finding the closest table first .. and then find ".go" except the current one
The selector you used is not correct.
$(this).closest('tr').siblings(".go").find("option")
This will give you nothing because tr doesn't have any sibling .go.
You have two solutions for the selector:
$(this).closest('tr').siblings("tr").find("option")
or
$('table.mytable').find("option")

Jquery loop through table select box

I have a table that shows some information of tickets
check this for the html of table. Check this jsfiddle
how can I loop through each select box click?, select box i.e rows will varies.
please give me some hints.
thank you...
<table id="tableTickets" class="table table-striped custab">
<thead>
<tr>
<th> Ticket Type </th>
<th> REMAINING </th>
<th> Price </th>
<th> Quantity </th>
</tr>
</thead>
<tbody>
<tr id="ticketRow1">
<td id="tdTicketName1">
<input type="hidden" id="ticketId" name="ticketId" value="1">
<h4 class="heading1">Name1</h4>
</td>
<td id="tdTicketQuantity1">
100 </td>
<td id="tdTicketPrice1">
<div id="divTicketPrice1">12.30</div>
</td>
<td>
<select class="form-control" name="ticketQty" id="ticketQty1" style="height:30px;">
<option value="0">0</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>
</select>
</td>
</tr>
<tr id="ticketRow2">
<td id="tdTicketName2">
<input type="hidden" id="ticketId" name="ticketId" value="2">
<h4 class="heading1">Name2</h4>
</td>
<td id="tdTicketQuantity2">
200 </td>
<td id="tdTicketPrice2">
<div id="divTicketPrice2">12.34</div>
</td>
<td>
<select class="form-control" name="ticketQty" id="ticketQty2" style="height:30px;">
<option value="0">0</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>
</select>
</td>
</tr>
<tr id="ticketRow3">
<td id="tdTicketName3">
<input type="hidden" id="ticketId" name="ticketId" value="3">
<h4 class="heading1">Name1</h4>
</td>
<td id="tdTicketQuantity3">
100 </td>
<td id="tdTicketPrice3">
<div id="divTicketPrice3">23.52</div>
</td>
<td>
<select class="form-control" name="ticketQty" id="ticketQty3" style="height:30px;">
<option value="0">0</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>
</select>
</td>
</tr>
<tr id="ticketRow4">
<td id="tdTicketName4">
<input type="hidden" id="ticketId" name="ticketId" value="4">
<h4 class="heading1">Name2</h4>
</td>
<td id="tdTicketQuantity4">
200 </td>
<td id="tdTicketPrice4">
<div id="divTicketPrice4">15.41</div>
</td>
<td>
<select class="form-control" name="ticketQty" id="ticketQty4" style="height:30px;">
<option value="0">0</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>
</select>
</td>
</tr>
<tr>
<td colspan="4" style="text-align:right;">
<h4 class="heading1">Total <div id="ticketPriceTotal" class="col-sm-12">000</div></h4>
</td>
</tr>
</tbody>
</table>
first give class to to price <div class="price"></div> and then write code given bellow,
$(document).on("change",".form-control",function(){
var total=0;
$("tbody tr").each(function(){
var price=$(this).find(".price").text();
var tickets=$(this).find(".form-control").val();
total=parseFloat(total)+(parseFloat(price)*parseFloat(tickets));
})
alert(total);
});
Check code on fiddle. with below code you can get each select box "onchange" or "onclick" event.
jsfiddle
$(document).ready(function(){
$('select').on('change',function(){
alert($(this).val())
})
})

Jquery iterate through multiple select options in a specific div

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/

Categories

Resources