Populate Dropdown with JavaScript
Hello Experts,
I have been using the below script for some time now in order to populate a dropdown at page load without issues, but today as i incorporated ith within a for loop for a set of dropdowns with an extension of 1, 2, 3 I get Object Required @ Line 1127 .
Cann any one see where I have gone wrong?
I have been using the below script for some time now in order to populate a dropdown at page load without issues, but today as i incorporated ith within a for loop for a set of dropdowns with an extension of 1, 2, 3 I get Object Required @ Line 1127 .
Cann any one see where I have gone wrong?
<!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" lang="en" xml:lang="en">
<head>
<title>MyLocalAdvantage.com</title>
<meta name="robots" content="index, follow" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 7]><link href="css/iehacks.css" rel="stylesheet" type="text/css" />
<![endif]-->
<script type="text/javascript" src="js/jquery.js"></script>
<!--[if IE 6]>
<script type="text/javascript" src="js/ie6pngfix.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('img, ul, ol, li, div, p, a, h1, h2, h3, h4, h5, h6, span, input, textarea, td');
</script>
<![endif]-->
<script type="text/javascript">
$(document).ready(function(){
$("a.choose_city").click(function(){
$("div.select_city_box").slideToggle();
});
});
function hide_login () {
document.getElementById('cover').style.display='none';
}
var len = 0;
function open_login () {
len += 2;
document.getElementById('login_box').style.width = len * 3 + "px"
document.getElementById('login_box').style.height = len * 1.8 + "px"
document.getElementById('login_box').style.marginTop = 210 - len * 0.75 + "px"
if (len == 2)
document.getElementById('cover').style.display='block';
if (len < 100)
setTimeout ("open_login();", 1);
}
function show_login () {
//len = 0;
//open_login();
document.getElementById('cover').style.display='block';
}
function validLogin() {
if (frmLogin.txtEMail.value == ''){
alert('Please provide e-mail address to login.');
show_login();
return false;
}
if (frmLogin.txtPassword.value == ''){
alert('Please provide password to login.');
show_login();
return false;
}
return true;
}
</script>
</script>
</head>
<body onLoad="pageLoad();
">
<a name="Login"> </a>
<div id="cover">
<div id="login_box">
<div class="reg_login">
<span class="message success_log">Please Sign in.</span>
<form name="frmLogin" action="login.asp" method="post" onSubmit="return validLogin();">
<ul>
<li><label>Email <span class="required">*</span></label>
<input name="txtEMail" type="text" size="25" class="input_item" value="" maxlength="100" /></li>
<li class="forgot"><label>Password <span class="required">*</span></label>
<input name="txtPassword" type="password" size="26" class="input_item" value="" maxlength="100" />
<span class="text"><a href="password-forgot.asp">Forgot your password?</a></span></li>
<li> <input class="btn" name="submit" type="submit" value="SIGN IN" onclick="hide_login();" />
<input class="Skipbtn" name="submit" type="submit" value="" onclick="hide_login(); return false;" /></li>
</ul>
</form>
</div>
</div>
</div>
<div class="page">
<!-- header -->
<div id="header">
<div class="headerwpr">
<!-- logo -->
<div class="logo">
<a href="home.asp"><img src="images/logo.png" alt="Home" title="Home" /></a>
</div>
<!-- / logo -->
<!-- header links -->
<div class="header_links">
<!--
<div class="select_city">
<a class="choose_city">Choose City</a>
</div>
<div class="searchbox">
<form action="" method="post">
<ul>
<li><input name="" type="text" value="" class="input_item" /></li>
<li><input name="" type="submit" value="Get the Deal" class="submit" /></li>
</ul>
</form>
</div>
-->
</div>
<!-- / header links -->
</div>
</div>
<!-- / header -->
<!-- select city box
<div class="select_city_box">
<div class="select_city_box_bg">
<a class="choose_city">hide</a>
<div class="canadian_provinces">
<h3>Canadian Provinces</h3>
<ul>
<li><a href="">Alberta</a></li>
<li><a href="">British Columbia</a></li>
<li><a href="">Manitoba</a></li>
<li><a href="">New Brunswick</a></li>
<li><a href="">Newfoundland</a></li>
<li><a href="">Northwest Territories</a></li>
<li><a href="">Nova Scotia</a></li>
<li><a href="">Nunavut</a></li>
<li><a href="">Ontario</a></li>
<li><a href="">Prince Edward Island</a></li>
<li><a href="">Quebec</a></li>
<li><a href="">Saskatchewan</a></li>
<li><a href="">Yukon</a></li>
</ul>
</div>
<div class="american_states">
<h3>American States</h3>
<ul>
<li><a href="">Alabama</a></li>
<li><a href="">Alaska</a></li>
<li><a href="">Arizona</a></li>
<li><a href="">Arkansas</a></li>
<li><a href="">California</a></li>
<li><a href="">Colorado</a></li>
<li><a href="">Connecticut</a></li>
<li><a href="">Delaware</a></li>
<li><a href="">District of Columbia</a></li>
<li><a href="">Florida</a></li>
<li><a href="">Georgia</a></li>
<li><a href="">Hawaii</a></li>
<li><a href="">Idaho</a></li>
</ul>
<ul>
<li><a href="">Illinois</a></li>
<li><a href="">Indiana</a></li>
<li><a href="">Iowa</a></li>
<li><a href="">Kansas</a></li>
<li><a href="">Kentucky</a></li>
<li><a href="">Louisiana</a></li>
<li><a href="">Maine</a></li>
<li><a href="">Maryland</a></li>
<li><a href="">Massachusetts</a></li>
<li><a href="">Michigan</a></li>
<li><a href="">Minnesota</a></li>
<li><a href="">Mississippi</a></li>
<li><a href="">Missouri</a></li>
</ul>
<ul>
<li><a href="">Montana</a></li>
<li><a href="">Nebraska</a></li>
<li><a href="">Nevada</a></li>
<li><a href="">New Hampshire</a></li>
<li><a href="">New Jersey</a></li>
<li><a href="">New Mexico</a></li>
<li><a href="">New York</a></li>
<li><a href="">North Carolina</a></li>
<li><a href="">North Dakota</a></li>
<li><a href="">Ohio</a></li>
<li><a href="">Oklahoma</a></li>
<li><a href="">Oregon</a></li>
<li><a href="">Pennsylvania</a></li>
</ul>
<ul>
<li><a href="">Rhode Island</a></li>
<li><a href="">South Carolina</a></li>
<li><a href="">South Dakota</a></li>
<li><a href="">Tennessee</a></li>
<li><a href="">Texas</a></li>
<li><a href="">Utah</a></li>
<li><a href="">Vermont</a></li>
<li><a href="">Virginia</a></li>
<li><a href="">Virgin Islands</a></li>
<li><a href="">Washington</a></li>
<li><a href="">West Virginia</a></li>
<li><a href="">Wisconsin</a></li>
<li><a href="">Wyoming</a></li>
</ul>
</div>
</div>
</div>
<!-- / select city box -->
<!-- post header -->
<div class="post_header">
<div class="rapidxwpr">
<!-- header bar -->
<div class="header_bar">
<div class="slogan">Great Deals! Every Day! All Day!</div>
<div class="header_but">
<ul>
<li class="welcome">3 items</li>
<li class="welcome">|</li>
<li class="welcome">$171.00</li>
<li class="welcome">|</li>
<li class="welcome"><a href="cart.asp"><img src="images/shopping_basket.png" width="21" height="18" alt="Shopping Basket icon" /> cart</a></li>
<li class="welcome">|</li>
<li class="register"><a onclick="show_login(); return false;" >SIGN-IN</a></li>
<li class="register"><a href="register.asp?myProfile=False&origPage=cart.asp">REGISTER</a>
</ul>
</div>
</div>
<!-- / header bar -->
<!-- topmenu -->
<div id="topmenu">
<div class="topmenu_container">
<ul>
<li><a href="home.asp">Featured Deals</a></li>
<li><a href="current.asp">Current Deals</a></li>
<li><a href="">Past Deals</a></li>
<li><a href="how-it-works.asp">How It Works</a></li>
<li><a href="faq.asp">FAQ</a></li>
<li><a href="contact.asp">Contact</a></li>
</ul>
</div>
</div>
<!-- / topmenu -->
<!-- main body -->
<div id="middle">
<!-- featured deal -->
<div class="featured_deal_top"></div>
<div class="featured_deal">
<div class="featured_deal_bg">
<div class="generic_container">
<h2> <center> Your Shopping Cart </center> </h2> <br>
<div class="checkout_method">
<h3 class="pane open"><a href="#">CART SUMMARY <span class="number">1</span></a></h3>
<div class="checkout_method_box clearingfix">
<div class="cart_summary">
<form id="frmCart" name="frmCart" method="post" action="cart.asp?action=upd&id=0">
<input type="hidden" name="txtItemCount" id="txtItemCount" value="3">
<table cellpadding="0" cellspacing="0">
<thead>
<tr>
<td class="voucher">Voucher</td>
<td class="available">Available</td>
<td class="desired_quantity">Desired Quantity</td>
<td class="unit">Unit Price</td>
<td class="you_pay">You Pay</td>
<td class="you_get">You Get</td>
<td class="you_save_dollars">You Save<br />
($)</td>
<td class="you_save_percent">You Save<br />
(%)</td>
<td class="link"> </td>
</tr>
</thead>
<tbody>
<input type="hidden" name="itemCount" id="itemCount" value="3">
<tr>
<td class="voucher">
<a href=" vouch-overview.asp?id=16">$59 for 3 Oxy-Jet Therapies With Consultation from Ici Paris Skin Care Clinic and Spa</a>
<input type="hidden" id="txtNameV1" name="txtNameV1" value="$59 for 3 Oxy-Jet Therapies With Consultation from Ici Paris Skin Care Clinic and Spa">
</td>
<td class="available">
<input name="txtAvailV1" type="text" class="input_item" id="txtAvailV1" maxlength="3" readonly="readonly"
value="80" />
</td>
<td class="desired_quantity">
<input type="hidden" name="hidQtyV1" id="hidQtyV1" value="1">
<select name="txtQtyV1" id="txtQtyV1" class="QtyV">
<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>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>
<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>
<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>
</select>
</td>
<td class="unit">$
<input name="txtPrice1" type="text" class="units" id="txtPrice16" readonly="readonly"
value="59.00" />
</td>
<td class="you_pay">$
<input name="txtCost1" type="text" class="units" id="txtCost1" readonly="readonly"
value="59.00" />
</td>
<td class="you_get">$
<input name="txtValue1" type="text" class="units" id="txtValue1" readonly="readonly"
value="285.00" />
</td>
<td class="you_save_dollars">$
<input name="txtSaveDoll1" type="text" class="units" id="txtSaveDoll1" readonly="readonly"
value="226.00" />
</td>
<td class="you_save_percent">
<input name="txtSavePerc1" type="text" class="you_percentage" id="txtSavePerc1" readonly="readonly"
value="79%" />
</td>
<td class="remove">
<input name="" type="button" value="" class="remove" onClick="javascript:confDel(1)" />
</td>
</tr>
<tr>
<td class="voucher">
<a href=" vouch-overview.asp?id=18">$12 for a $24 buffet for one or lunch buffet for 2 at Woo Buffet Restaurant</a>
<input type="hidden" id="txtNameV2" name="txtNameV2" value="$12 for a $24 buffet for one or lunch buffet for 2 at Woo Buffet Restaurant">
</td>
<td class="available">
<input name="txtAvailV2" type="text" class="input_item" id="txtAvailV2" maxlength="3" readonly="readonly"
value="80" />
</td>
<td class="desired_quantity">
<input type="hidden" name="hidQtyV2" id="hidQtyV2" value="1">
<select name="txtQtyV2" id="txtQtyV2" class="QtyV">
<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>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>
<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>
<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>
</select>
</td>
<td class="unit">$
<input name="txtPrice2" type="text" class="units" id="txtPrice18" readonly="readonly"
value="12.00" />
</td>
<td class="you_pay">$
<input name="txtCost2" type="text" class="units" id="txtCost2" readonly="readonly"
value="12.00" />
</td>
<td class="you_get">$
<input name="txtValue2" type="text" class="units" id="txtValue2" readonly="readonly"
value="24.00" />
</td>
<td class="you_save_dollars">$
<input name="txtSaveDoll2" type="text" class="units" id="txtSaveDoll2" readonly="readonly"
value="12.00" />
</td>
<td class="you_save_percent">
<input name="txtSavePerc2" type="text" class="you_percentage" id="txtSavePerc2" readonly="readonly"
value="50%" />
</td>
<td class="remove">
<input name="" type="button" value="" class="remove" onClick="javascript:confDel(2)" />
</td>
</tr>
<tr>
<td class="voucher">
<a href=" vouch-overview.asp?id=15">$100 for a 3-course Dinner for Two</a>
<input type="hidden" id="txtNameV3" name="txtNameV3" value="$100 for a 3-course Dinner for Two">
</td>
<td class="available">
<input name="txtAvailV3" type="text" class="input_item" id="txtAvailV3" maxlength="3" readonly="readonly"
value="55" />
</td>
<td class="desired_quantity">
<input type="hidden" name="hidQtyV3" id="hidQtyV3" value="1">
<select name="txtQtyV3" id="txtQtyV3" class="QtyV">
<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>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
</select>
</td>
<td class="unit">$
<input name="txtPrice3" type="text" class="units" id="txtPrice15" readonly="readonly"
value="100.00" />
</td>
<td class="you_pay">$
<input name="txtCost3" type="text" class="units" id="txtCost3" readonly="readonly"
value="100.00" />
</td>
<td class="you_get">$
<input name="txtValue3" type="text" class="units" id="txtValue3" readonly="readonly"
value="275.00" />
</td>
<td class="you_save_dollars">$
<input name="txtSaveDoll3" type="text" class="units" id="txtSaveDoll3" readonly="readonly"
value="175.00" />
</td>
<td class="you_save_percent">
<input name="txtSavePerc3" type="text" class="you_percentage" id="txtSavePerc3" readonly="readonly"
value="64%" />
</td>
<td class="remove">
<input name="" type="button" value="" class="remove" onClick="javascript:confDel(3)" />
</td>
</tr>
<tr>
<td colspan="3" class="voucher"></td>
<td class="unit_totals">TOTALS:</td>
<td class="you_pay_totals">$171.00</td>
<td class="you_get_totals">$584.00</td>
<td class="you_save_dollars_totals">$413.00</td>
<td colspan="2" class="you_save_percent_totals">71%</td>
</tr>
</tbody>
</table>
<div class="cart_buttons">
<ul class="buttons_spacing">
<li>
<input type="button" class="continuecart"
onClick="javascript:location.href = 'home.asp';" />
</li>
<li>
<input type="button" class="empytcart"
onClick="javascript:confDel(0);" />
</li>
<li>
<input type="submit" class="updateshopping"/>
</li>
</ul>
<ul class="buttons_spacing">
<li>
<input type="button" class="registercart"
onClick="javascript:location.href = 'register.asp?myProfile=False&origPage=cart.asp';" />
</li>
<li>
<input type="button" class="logincart"
onClick="javascript:location.href = '#Login'; show_login(); return false;" />
</li>
</ul>
</div>
<!--INPUT type="button" value="Button" id=button1 name=button1 ONCLICK="return update();" -->
</form>
</div>
</div>
</div>
</div>
</div>
<!-- / featured deal -->
</div>
<!-- / main body -->
</div>
</div>
<!-- post header -->
</div>
<!-- footer -->
<div id="footer">
<div class="rapidxwpr">
<!-- footer links -->
<div class="footer_links">
<div class="learnmore">
<h3>LEarn MOre</h3>
<ul>
<li><a href="faq.asp">FAQ</a></li>
<li><a href="how-it-works.asp">How It Works</a></li>
<li><a href="contact.asp">Contact / Feedback</a></li>
<li><a href="">Refer a Friend</a></li>
</ul>
</div>
<div class="company">
<h3>company</h3>
<ul>
<li><a href="">About Us</a></li>
<li><a href="terms.asp">Terms</a></li>
<li><a href="privacy.asp">Privacy</a></li>
</ul>
</div>
<div class="company">
<h3>business</h3>
<ul>
<li><a href="">Suggest a Business</a></li>
<li><a href="">Get Your Business Featured</a></li>
</ul>
</div>
<div class="followus">
<h3>follow us</h3>
<ul>
<li><a href="">Facebook</a></li>
<li><a href="">Twitter</a></li>
<li><a href="">Get Daily Deal Alert emails!</a></li>
</ul>
</div>
</div>
<!-- / footer links -->
<!-- copyright -->
<div class="copyright">
<span class="copyright">© 2010 mylocaladvantage.com.<br /> All rights reserved.</span>
</div>
<!-- / copyright -->
<!-- creadit/verfication/hosting info -->
<div class="creditcards">
<!--img src="images/siteseal_gd_3_h_d_m.gif" width="132" height="31" alt="Godaddy Verification Seal" /-->
<span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=2kLJWyprOXYBtu2hgDXfGNE7oxNjXV4TWKw2VZLHn4MWu2JkVPElAR3algg"></script><br/><a style="font-family: arial; font-size: 9px" href="http://www.godaddy.com/ssl/ssl-certificates.aspx" target="_blank">SSL Cert</a></span>
<br />
<br />
<img src="images/credit-cards-logos.png" width="150" height="34" alt="Acceptable Creadit Cards" />
<br />
Hosted by <a href="#">APD</a>
</div>
<!-- / creadit/verfication/hosting info -->
</div>
</div>
<!-- / footer -->
</body>
</html>
<script type="text/javascript">
function pageLoad(){
var cartItems = document.getElementById("itemCount").value;
// alert(cartItems);
for (c=1; c<=cartItems; c++)
{
fillCBO("txtQtyV" + c, "hidQty" + c);
}
}
function fillCBO(cboControl, txtControl)
{
var ddl = document.getElementById(cboControl);
for (i=0;i<ddl.options.length;i++)
{
if (ddl.options[i].value==document.getElementById(txtControl).value)
{
ddl.selectedIndex=i;
return;
}
}
}
function confDel(arrID)
{
if(arrID == 0)
{
if(confirm('Are you sure you would like to empty your shopping cart?'))
{
location.href = 'cart.asp?action=empty';
}
}
if(arrID != 0)
{
var deal = document.getElementById("txtNameV" + arrID).value;
if(confirm('Are you sure you would like to delete ' + deal + ' from your shopping cart?'))
{
location.href = 'cart.asp?action=del&id='+arrID;
}
}
}
</script>ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER