JavaScript - Need Help With 2 Level, Drop Down List
Hi There.
I've been reading this forum for quite sometime, but today is my first post, hope you guys can help. Here is how the code works: (its like a phone directory) -User first selects the dept. -Once selected, a second drop down populates with the names of each person in that department. -I want the contact info to show on the page once they select this last step. I need for when the user selects this second options for a link to open inside a iFrame inside of the same html page. I uploaded the file here for you to see: www.pioneer-energy.us/tf2/contact-us.html Here is the code for the HTML doc: Code: <body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000" onLoad="fillCategory();"> <FORM name="drop_list" action="yourpage.php" method="POST" > <SELECT NAME="Department" onChange="SelectSubCat();" > <Option value="">Select Department</option> </SELECT> <SELECT id="SubCat" NAME="SubCat"> <Option value="">SubCat</option> </SELECT> </form> Here is the .js file code Code: function fillCategory(){ // this function is used to fill the category list on load addOption(document.drop_list.Department, "Executive-Management", "Executive Management"); addOption(document.drop_list.Department, "Marketing", "Marketing", ""); addOption(document.drop_list.Department, "Annuities", "Annuities", ""); addOption(document.drop_list.Department, "Underwriting/Case Management", "Underwriting/Case Management", ""); addOption(document.drop_list.Department, "Human Resources", "Human Resources", ""); addOption(document.drop_list.Department, "Commissions", "Commissions", ""); addOption(document.drop_list.Department, "Policy Owner Services", "Policy Owner Services", ""); addOption(document.drop_list.Department, "Information Technology", "Information Technology", ""); addOption(document.drop_list.Department, "APS", "APS", ""); } function SelectSubCat(){ // ON selection of category this function will work removeAllOptions(document.drop_list.SubCat); addOption(document.drop_list.SubCat, "", "SubCat", ""); if(document.drop_list.Department.value == 'Executive-Management'){ addOption(document.drop_list.SubCat,"MartyGreenberg", "Marty Greenberg - President"); addOption(document.drop_list.SubCat,"LisaGreenberg ", "Lisa Greenberg - Vice President"); addOption(document.drop_list.SubCat,"CraigBrown", "Craig Brown - CFO"); addOption(document.drop_list.SubCat,"RitaBogan", "Rita Bogan - Executive Secretary & Case Management"); addOption(document.drop_list.SubCat,"DianaGreenberg", "Diana Greenberg - Underwriting Manager"); } if(document.drop_list.Department.value == 'Marketing'){ addOption(document.drop_list.SubCat,"RonBielefelt", "Ron Bielefelt - Chief Marketing Officer"); addOption(document.drop_list.SubCat,"PeterMilanez", "Peter Milanez - Brokerage Manager"); addOption(document.drop_list.SubCat,"MarkRBugli", "Mark R. Bugli - CLU, ChFC "); addOption(document.drop_list.SubCat,"HowardMandel", "Howard Mandel - Director of Business Development"); addOption(document.drop_list.SubCat,"DeborahSanchez", "Deborah Sanchez - Brokerage Supervisor "); addOption(document.drop_list.SubCat,"SylviaMariscal", "Sylvia Mariscal - Life Settlements"); addOption(document.drop_list.SubCat,"PeterMilanez", "Peter Milanez - Brokerage Manager"); addOption(document.drop_list.SubCat,"JosephTanner", "Joseph Tanner - Brokerage Manager Assistant", ""); } if(document.drop_list.Department.value == 'Annuities'){ addOption(document.drop_list.SubCat,"SethMoses", "Seth Moses - Director of Annuities"); addOption(document.drop_list.SubCat,"SteveAvila", "Steve Avila - Assistant to Seth Moses"); } if(document.drop_list.Department.value == 'Underwriting/Case Management'){ addOption(document.drop_list.SubCat,"DianaGreenberg", "Diana Greenberg - Underwriting Manager"); addOption(document.drop_list.SubCat,"KimberlyFleming", "Kimberly Fleming - Case Manager "); addOption(document.drop_list.SubCat,"LarissaBurton", "Larissa Burton - Case Manager Assistant to Kimberly Fleming"); addOption(document.drop_list.SubCat,"MariaAntebi", "Maria Antebi - Case Manager"); addOption(document.drop_list.SubCat,"LilianaGalvan", "Liliana Galvan - Case Manager"); addOption(document.drop_list.SubCat,"KimberlyKoontz", "Kimberly Koontz - Case Manager Assistant to Liliana Galvan"); addOption(document.drop_list.SubCat,"ChastaSpikes", "Chasta Spikes - Case Manager"); addOption(document.drop_list.SubCat,"SylviaMarsicalShank", "Sylvia Marsical-Shank - Case Manager"); addOption(document.drop_list.SubCat,"TriciaRomain ", "Tricia Romain - Case Manager"); addOption(document.drop_list.SubCat,"BetoRuiz", "Beto Ruiz - Case Manager"); addOption(document.drop_list.SubCat,"DavidGarcia", "David Garcia - Case Manager Assistant"); } if(document.drop_list.Department.value == 'Human Resources'){ addOption(document.drop_list.SubCat,"MarieOkamura", "Marie Okamura - Human Resources Director"); } if(document.drop_list.Department.value == 'Commissions'){ addOption(document.drop_list.SubCat,"WalterHelbig", "Walter Helbig, FLMI - Licensing"); addOption(document.drop_list.SubCat,"KenFong", "Ken Fong - Licensing"); addOption(document.drop_list.SubCat,"JimTigrak", "Jim Tigrak - Commissions"); } if(document.drop_list.Department.value == 'Licensing'){ addOption(document.drop_list.SubCat,"TessSlezak ", "Tess Slezak - Licensing"); addOption(document.drop_list.SubCat,"ArleneAuerhan ", "ArleneAuerhan - Licensing"); addOption(document.drop_list.SubCat,"JimTigrak", "Jim Tigrak - Forms & Supplies"); } if(document.drop_list.Department.value == 'Policy Owner Services'){ addOption(document.drop_list.SubCat,"LanTran", "Lan Tran - Policy Services"); addOption(document.drop_list.SubCat,"GianSanchez ", "Gian Sanchez - Receptionist"); addOption(document.drop_list.SubCat,"ArmonTodd ", "Armon Todd - Office Support"); } if(document.drop_list.Department.value == 'Information Technology'){ addOption(document.drop_list.SubCat,"HenryCholakyan ", "Henry Cholakyan - IT Director"); } if(document.drop_list.Department.value == 'APS'){ addOption(document.drop_list.SubCat,"CarmenAllen ", "Carmen Allen - APS Supervisor"); } } ////////////////// function removeAllOptions(selectbox) { var i; for(i=selectbox.options.length-1;i>=0;i--) { //selectbox.options.remove(i); selectbox.remove(i); } } function addOption(selectbox, value, text ) { var optn = document.createElement("OPTION"); optn.text = text; optn.value = value; selectbox.options.add(optn); } Thanks for any help in advanced! Similar Tutorialsthe code below was got from <http://www.javascriptkit.com/javatutors/selectcontent2.shtml> I was following to tutorial to learn how to create multi-level select list in javascript. i have gone through it but wanted to print the individual selected item in each option, i could not. the first worked well for be because the selected options are manually typed, but the last option became difficult because they are dynamically loaded. Please can anyone guild me on how to print the selected option of the second field? <form name="classic"> <select name="countries" size="4" onChange="updatecities(this.selectedIndex)" style="width: 150px"> <option selected>Select A City</option> <option value="usa">USA</option> <option value="canada">Canada</option> <option value="uk">United Kingdom</option> </select> <select name="cities" size="4" style="width: 150px" onClick="alert(this.options[this.options.selectedIndex].value)"> </select> </form> <script type="text/javascript"> var countrieslist=document.classic.countries var citieslist=document.classic.cities var cities=new Array() cities[0]="" cities[1]=["New York|newyorkvalue", "Los Angeles|loangelesvalue", "Chicago|chicagovalue", "Houston|houstonvalue", "Austin|austinvalue"] cities[2]=["Vancouver|vancouvervalue", "Tonronto|torontovalue", "Montreal|montrealvalue", "Calgary|calgaryvalue"] cities[3]=["London|londonvalue", "Glasgow|glasgowsvalue", "Manchester|manchestervalue", "Edinburgh|edinburghvalue", "Birmingham|birminghamvalue"] function updatecities(selectedcitygroup){ citieslist.options.length=0 if (selectedcitygroup>0){ for (i=0; i<cities[selectedcitygroup].length; i++) citieslist.options[citieslist.options.length]=new Option(cities[selectedcitygroup][i].split("|")[0], cities[selectedcitygroup][i].split("|")[1]) } } </script> Can anyone spot how to make this drop-in popup do so at slightly higher horizontal level than currently? I've played around with it quite a bit, but no luck. Code: <html> <head> <meta name="GENERATOR" content="Microsoft FrontPage 6.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 1</title> <script language="JavaScript1.2"> // Drop-in content box- By Dynamic Drive // For full source code and more DHTML scripts, visit http://www.dynamicdrive.com // This credit MUST stay intact for use var ie=document.all var dom=document.getElementById var ns4=document.layers var calunits=document.layers? "" : "px" var bouncelimit=32 //(must be divisible by 8) var direction="up" function initbox(){ if (!dom&&!ie&&!ns4) return crossobj=(dom)?document.getElementById("dropin").style : ie? document.all.dropin : document.dropin scroll_top=(ie)? truebody().scrollTop : window.pageYOffset crossobj.top=scroll_top-250+calunits crossobj.visibility=(dom||ie)? "visible" : "show" dropstart=setInterval("dropin()",50) } function dropin(){ scroll_top=(ie)? truebody().scrollTop : window.pageYOffset if (parseInt(crossobj.top)<100+scroll_top) crossobj.top=parseInt(crossobj.top)+40+calunits else{ clearInterval(dropstart) bouncestart=setInterval("bouncein()",50) } } function bouncein(){ crossobj.top=parseInt(crossobj.top)-bouncelimit+calunits if (bouncelimit<0) bouncelimit+=8 bouncelimit=bouncelimit*-1 if (bouncelimit==0){ clearInterval(bouncestart) } } function dismissbox(){ if (window.bouncestart) clearInterval(bouncestart) crossobj.visibility="hidden" } function truebody(){ return (document.compatMode!="BackCompat")? document.documentElement : document.body } window.onload=initbox </script> </head> <body> <div id="dropin" style="position: absolute; visibility: hidden; left: 200px; top: 100px; width: 500px; height: 300px; background-color: #F5F5F5"> <div align="right"> <a href="#" onClick="dismissbox();return false">[Close Box] </a> </div> <p>SPECIFY YOUR CONTENT HERE. IT COULD BE TEXT, IMAGES, OR RICH HTML </div> </body> </html> Hi all, I have been struggling on a bit of code for a while now. I need to populate a second drop down list (Region) based upon the selection of the first (County). I have found a piece of code that works on its own and have adapted to suit my needs - see below. However, when I drop it into my main page the javascript is not working. It's because of the formObject but I just don't know enough to resolve this! Furthermore, I need the textboxes the user has already completed in the form to retain their value once the javascript kicks in as the completed form will submit to a database. This piece of code is working well . . . . Code: <?php $link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error()); mysql_select_db('mydatabase') or die('Could not select database'); if(isset($_GET["County"]) && is_numeric($_GET["County"])) { $County = $_GET["County"]; } if(isset($_GET["Region"]) && is_numeric($_GET["Region"])) { $Region = $_GET["Region"]; } ?> <script language="JavaScript"> function autoSubmit() { var formObject = document.forms['theForm']; formObject.submit(); } </script> <form name="theForm" method="get"> <!-- County SELECTION BASED ON city VALUE --> <?php ?> <select name="County" onChange="autoSubmit();"> <option value=''</option> <?php //POPULATE DROP DOWN MENU WITH COUNTRIES FROM A GIVEN city $sql = "SELECT * FROM county_regions"; $counties = mysql_query($sql,$link); while($row = mysql_fetch_array($counties)) { echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>"); } ?> </select> <?php ?> <br><br> <?php if($County!= null && is_numeric($County)) { ?> <select name="Region" onChange="autoSubmit();"> <?php //POPULATE DROP DOWN MENU WITH RegionS FROM A GIVEN city, County $sql = "SELECT * FROM county_regions WHERE CountyID = $County "; $Regions = mysql_query($sql,$link); while($row = mysql_fetch_array($Regions)) { echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>"); } ?> </select> <?php } ?> What follows is my form where the javascript is not working - edited quite a bit to save on space! Code: <head> <script language="JavaScript"> function autoSubmit() { var formObject = document.forms['subform']; formObject.submit(); } </script> </head> <form enctype="multipart/form-data" method="post" action="add_attraction01.php" FORM NAME="FormName"> <input type="hidden" name="MAX_FILE_SIZE" value="32768" /> <label for="Business_name">Business Name</label> <input type="text" size="60" STYLE="color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: #72A4D2;" <id="Business_name" name="Business_name" maxlength=60/><font size="1" face="arial" color="red">Required field</font><br /> <label for="StreetAddress">Address</label> <input type="text" size="60" rows="2" id="StreetAddress" name="StreetAddress" maxlength=120/><font size="1" face="arial" color="red">Required field</font><br /> <label for="Town">Town</label> <input type="text" size="25" id="Town" name="Town" maxlength=25/><font size="1" face="arial" color="red">Required field</font><br /> <?php $link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error()); mysql_select_db('mydatabase') or die('Could not select database'); if(isset($_GET["County"]) && is_numeric($_GET["County"])) { $County = $_GET["County"]; } if(isset($_GET["Region"]) && is_numeric($_GET["Region"])) { $Region = $_GET["Region"]; } ?> <form name = "subform" method="get"> <select name="County" onChange="autoSubmit();"> <option value=''</option> <?php $sql = "SELECT * FROM county_regions"; $counties = mysql_query($sql,$link); while($row = mysql_fetch_array($counties)) { echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>"); } ?> </select> <?php ?> <br><br> <?php if($County!= null && is_numeric($County)) { ?> <select name="Region" onChange="autoSubmit();"> <?php $sql = "SELECT * FROM county_regions WHERE CountyID = $County "; $Regions = mysql_query($sql,$link); while($row = mysql_fetch_array($Regions)) { echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>"); } ?> </select> <?php } ?> <input type="text" size="20"id="Tel_No" name="Tel_No" maxlength=20 onkeypress="return isNumberKey(event)"/><font size="1" face="arial" color="red">Required field</font><br /> <br/> <input type="submit" value="Submit your attraction" name="submit" onclick="return BothFieldsIdenticalCaseSensitive();"/> </form> </body> </html> It's probably obvious to you guys!! Thanks in advance for your help. i need help on designing a drop down list menu. this rolls down and shows other list of options to click on. i work in dreamweaver so javascripts and others can be incorporated. thanks all Hello everyone! =] I need help with Javascript. I want to have a script that if one chooses to register for dinner, then validation will be performed to ensure whether the user have chosen that they are Vegetarian or not. If the user chooses not to attend dinner, then there is no need to validate the Vegetarian option. Here's the code: Code: <p>Register for Conference Dinner?<select type="text" name="conf_dinner" id="conf_dinner"> <option> Please Select </option> <option value="N">No</option> <option value="Y">Yes</option> </select></p> <p> Are you a vegetarian?<select type="text" name="vegetarian" id="vegetarian"> <option value="N">No</option> <option value="Y">Yes</option> </select></p> Hello All, I am trying to create a three drop down lists for my job. The three drop downs would be: Degree Type (certificate, associate's, bachelor's, etc) Category (Arts & Humanities, Automotive, Computers & IT etc.) Program (Desktop Publishing, Automotive Technician Training, Network Systems, etc.) The Category list needs to be dependent on the degree type and the Program list needs to be dependent on the Category list. I need to have values that will submit to my form but ONLY for the Program List. For example: <option value="CECS">Cisco</option> <option value="CEIT">Information Technology (General)</option> <option value="CEMS">Microsoft</option> <option value="CENSYS">Network Systems</option> Please note that I must use these program codes as values and I cannot use the option name as the value. This does not have to look good, it just needs to work as it is for internal use only within my company. This form will never be used by random web surfers. If someone can point me to a tutorial for a good triple drop down that will pass ONLY the values of the third list, that would be great! Thanks! Hello i use a javascript to use drop down lists so i display the appropriate products to user. Atm no matter the user option i display 3 drop down lists in whole products. Lets say the drop down lists are like manufacturer/order by/sochet. When the user wish to see "processors" then the sochet list have values, but when he choose "printers" the sochet list is empty since the printers dont contan sochets. In this case i want to hide the sochet drop down list in order to be more familiar to the user is that possible? My js looks like this Code: <script type="text/javascript"> function showUser() { var q=document.getElementById("manuf"); var q_val = q.options[q.selectedIndex].value; var t=document.getElementById("soch"); var t_val = t.options[t.selectedIndex].value; var c=document.getElementById("order"); var c_val = c.options[c.selectedIndex].value; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { var q=document.getElementById("manuf"); var q_val = q.options[q.selectedIndex].value; var t=document.getElementById("soch"); var t_val = t.options[t.selectedIndex].value; var c=document.getElementById("order"); var c_val = c.options[c.selectedIndex].value; if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","productsdata.php?q=" + q_val + "&t=" + t_val+"&c=" +c_val, true); xmlhttp.send(); } </script> and my drop down lists like PHP Code: <select name="products2" id="soch" onchange="showUser()"> <option value="" selected="selected">Sochet</option> <?php do { ?> <option value="<?php echo $row_sochet['sochet']?>"><?php echo $row_sochet['sochet']?></option> <?php } while ($row_sochet = mysql_fetch_assoc($sochet)); $rows = mysql_num_rows($sochet); if($rows > 0) { mysql_data_seek($sochet, 0); $row_sochet = mysql_fetch_assoc($sochet); } ?> </select> Hi everyone, My website has 10 drop down lists. And I want to carry out form validation. I have written the code for form validation, but I am not sure where the code should be inserted, nor am I sure how to link it to the click of a submit button. My code (without the form validation function) is as follows: Code: <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>sample title</title> <script type = "text/javascript"> //<![CDATA[ var opts = []; var age, caste, profession, bachelor, master, doc, country, color, height, marriage, father; function formValues(form, ele) { var form = document.forms[form].elements[ele], val = form.value, index = form.selectedIndex; if (typeof opts[ele] === 'undefined') opts.push(ele); opts[ele] = form.options[index].text; } function processForm() { var set = [ {form: 'age', ele: 'groomage'}, {form: 'caste', ele: 'groomcaste'}, {form: 'profession', ele: 'groomprofession'}, {form: 'bachelor', ele: 'groombachelor'}, {form: 'doc', ele: 'groomdoc'}, {form: 'country', ele: 'groomcountry'}, {form: 'color', ele: 'groomcolor'}, {form: 'height', ele: 'groomheight'}, {form: 'marriage', ele: 'groommarriage'}, {form: 'father', ele: 'groomfather'} ]; for (var i in set) { formValues(set[i].form, set[i].ele); } switch (opts['groomage']) { case '23': age = 0.25; break; case '24': age = 0.35; break; case '25': age = 0.55; break; case '26': age = 0.75; break; case '27': age = 0.99; break; case '28': age = 0.85; break; case '29': age = 0.75; break; case '30': age = 0.65; break; case '31-35': age = 0.45; break; case '36-40': age = 0.35; break; default: age = 0.5; } switch (opts['groomcaste']) { case 'Bania': caste = 0.75; break; case 'Brahmin': caste = 0.99; break; case 'Labanas': caste = 0.75; break; case 'Rajput': caste = 0.85; break; case 'Maravar': caste = 0.80; break; case 'Kayastha': caste = 0.75; break; case 'Bhumihar': caste = 0.80; break; case 'Jat': caste = 0.65; break; case 'Kshatriya': caste = 0.75; break; case 'Kamma': caste = 0.90; break; case 'Reddy': caste = 0.95; break; case 'Vaishya': caste = 0.85; break; case 'Kappu': caste = 0.90; break; default: caste = 0.5; } switch (opts['groomprofession']) { case 'Doctor': profession = 0.85; break; case 'Family Business': profession = 0.65; break; case 'Engineer': profession = 0.75; break; case 'Lawyer': profession = 0.75; break; case 'CA': profession = 0.75; break; default: profession = 0.5; } switch (opts['groombachelor']) { case 'Less than 20,000': bachelor = 0; break; case '20,000 - 30,000': bachelor = 0.25; break; case '30,000 - 40,000': bachelor = 0.35; break; case '40,000 - 50,000': bachelor = 0.45; break; case '50,000 - 70,000': bachelor = 0.65; break; case '70,000 - 1 Lakh': bachelor = 0.75; break; default: bachelor = 0.5; } switch (opts['groomdoc']) { case 'Massachusetts Institute of Technology (MIT)': doc = 0.99; break; case 'Stanford': doc = 0.99; break; case 'Harvard': doc = 0.99; break; case 'Indian Instititute of Technology (IIT)': doc = 0.85; break; case 'Indian Instititute of Management (IIM)': doc = 0.90; break; case 'IIT + IIM': doc = 0.99; break; case 'None of the Above': doc = 0.35; break; default: doc = 0.55; } switch (opts['groomcountry']) { case 'USA': country = 0.99; break; case 'Any Country less developed than India': country = 0.11; break; case 'India': country = 0.55; break; case 'Any European Country/Any Country more developed than India': country = 0.99; break; default: country = 0.55; } switch (opts['groomcolor']) { case 'Pitch Black (Not visible on a moonless night)': color = 0.11; break; case 'Black': color = 0.25; break; case 'Brown': color = 0.35; break; case 'Wheatish (Almost White. Would need some Fair n Lovely)': color = 0.65; break; case 'Fairy White': color = 0.99; break; case 'White': color = 0.85; break; default: color = 0.5; } switch (opts['groomheight']) { case '5\'5"': height = 0.55; break; case '5\'6"': height = 0.65; break; case '5\'4"': height = 0.45; break; case '5\'7"': height = 0.70; break; case '5\'8"': height = 0.75; break; case '5\'9"': height = 0.80; break; case 'Less than 5\'4"': height = 0.11 break; case '5\'10"': height = 0.85; break; case '5\'11"': height = 0.85; break; case 'Greater than 6\'1"': height = 0.85; break; case '6': height = 0.99; break; case '6\'1"': height = 0.99; break; default: height = 0.5; } switch (opts['groommarriage']) { case 'More than 2': marriage = 0; break; case '2': marriage = 0.25; break; case '1': marriage = 0.45; break; case '0': marriage = 0.99; break; default: marriage = 0.5; } switch (opts['groomfather']) { case 'IAS': father = 0.99; break; case 'Family Business': father = 0.65; break; case 'Doctor': father = 0.85; break; case 'Lawyer': father = 0.75; break; case 'Engineer': father = 0.80; break; case 'CA': father = 0.75; break; case 'Engineer + MBA': father = 0.99; break; default: father = 0.5; } } window.onload = processForm; function processOrder() { processForm(); var total = 1.5*age + 3.25*bachelor + profession + 0.75*father + marriage + country + height + (doc + caste + color)/2; var pageNumber = Math.floor(total); //alert(pageNumber); window.open('Page ' + pageNumber + '.html'); } //]]> </script> </head> <body bgcolor="#ADD8E6"> <center> <font size="6"><strong>sample text 1</strong></font> </center> <br /><br /> <br /><br /> <em>*sample text 2</em> <center> <strong>Groom's Age</strong> <form name="age"> <select name="groomage" onclick="formValues('age', 'groomage')"> <option value="a1"></option> <option value="a2">23</option> <option value="a3">24</option> <option value="a4">25</option> <option value="a5">26</option> <option value="a6">27</option> <option value="a7">28</option> <option value="a8">29</option> <option value="a9">30</option> <option value="a10">31-35</option> <option value="a11">36-40</option> </select> </form> <br /> <strong>Groom's Caste</strong> <form name="caste"> <select name="groomcaste" onchange="formValues('caste', 'groomcaste')"> <option value="b1"></option> <option value="b2">Brahmin</option> <option value="b3">Bania</option> <option value="b4">Kayastha</option> <option value="b5">Kshatriya</option> <option value="b6">Bhumihar</option> <option value="b7">Maravar</option> <option value="b8">Reddy</option> <option value="b9">Kamma</option> <option value="b14">Kappu</option> <option value="b10">Jat</option> <option value="b11">Labanas</option> <option value="b12">Rajput</option> <option value="b13">Vaishya</option> </select> </form> <br /> <strong>Groom's Current Profession</strong> <form name="grofession"> <select name="groomprofession" onchange="formValues('profession', 'groomprofession')"> <option value="c1"></option> <option value="c2">Doctor</option> <option value="c3">Engineer</option> <option value="c4">Lawyer</option> <option value="c5">CA</option> <option value="c6">Family Business</option> <option value="c7">Teacher</option> <option value="c8">Journalist</option> <option value="c9">Business Analyst</option> </select> </form> <br /> <strong>Groom's Monthly Salary</strong> <form name="bachelor"> <select name="groombachelor" onchange="formValues('bachelor', 'groombachelor')"> <option value="d1"></option> <option value="d3">Less than 20,000</option> <option value="d4">20,000 - 30,000</option> <option value="d5">30,000 - 40,000</option> <option value="d6">40,000 - 50,000</option> <option value="d7">50,000 - 70,000</option> <option value="d8">70,000 - 1 Lakh</option> </select> </form> <br /> <strong>Groom's Alma Mater</strong> <form name="doc"> <select name="groomdoc" onchange="formValues('doc', 'groomdoc')"> <option value="f1"></option> <option value="f2">Massachusetts Institute of Technology (MIT)</option> <option value="f3">Stanford</option> <option value="f4">Harvard</option> <option value="f5">Indian Instititute of Technology (IIT)</option> <option value="f6">Indian Institute of Management (IIM)</option> <option value="f7">IIT + IIM</option> <option value="f8">None of the Above</option> </select> </form> <br /> <strong>The Groom is working in</strong> <form name="country"> <select name="groomcountry" onchange="formValues('country', 'groomcountry')"> <option value="g1"></option> <option value="g2">India</option> <option value="g3">USA</option> <option value="g4">Any European Country/Any Country more developed than India</option> <option value="g5">Any Country less developed than India</option> </select> </form> <br /> <strong>Groom's Skin Color</strong> <form name="color"> <select name="groomcolor" onchange="formvalues('color', 'groomcolor')"> <option value="h1"></option> <option value="h2">Fairy White</option> <option value="h3">White</option> <option value="h4">Wheatish (Almost White. Would need some Fair n Lovely)</option> <option value="h5">Brown</option> <option value="h6">Black</option> <option value="h7">Pitch Black (Not visible on a moonless night)</option> </select> </form> <br /> <strong>Groom's Height</strong> <form name="height"> <select name="groomheight" onchange="formvalues('height', 'groomheight')"> <option value="i1"></option> <option value="i2">Less than 5'4"</option> <option value="i3">5'5"</option> <option value="i4">5'6"</option> <option value="i5">5'7"</option> <option value="i6">5'8"</option> <option value="i7">5'9"</option> <option value="i8">5'10"</option> <option value="i9">5'11"</option> <option value="i10">6'</option> <option value="i11">6'1"</option> <option value="i12">Greater than 6'1"</option> </select> </form> <br /> <strong>Number of times the Groom has married before</strong> <form name="marriage"> <select name="groommarriage" onchange="formvalues('marriage', 'groommarriage')"> <option value="j1"></option> <option value="j2">0</option> <option value="j3">1</option> <option value="j4">2</option> <option value="j5">More than 2</option> </select> </form> <br /> <strong>Groom's Father's Profession</strong> <form name="father"> <select name="groomfather" onchange="formvalues('father', 'groomfather')"> <option value="k1"></option> <option value="k2">Engineer</option> <option value="k3">Doctor</option> <option value="k4">IAS</option> <option value="k5">Lawyer</option> <option value="k6">CA</option> <option value="k7">IAS</option> <option value="k8">Engineer + MBA</option> <option value="k9">Family Business</option> <option value="k10">None of the above</option> </select> </form> <br /> <input type="button" value="Calculate Dowry Amount" onclick="processOrder()" /> <br /> <br /> <center> <a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="Plebeian42">Tweet</a> <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> </center> <br /> <div style="width: 100px; margin: 0 auto; padding: 4px;"> <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a> <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </div> <br /><br /> </body> </html> The code for the FormValidation runs as follows (which I am not sure where to insert), and also not very sure whether it's the correct code or not. Code: function ValidateForm() { si = document.age.groomage.selectedIndex; si_1 = document.caste.groomcaste.selectedIndex; si_2 = document.profession.groomprofession.selectedIndex; si_3 = document.bachelor.groombachelor.selectedIndex; si_4 = document.doc.groomdoc.selectedIndex; si_5 = document.country.groomcountry.selectedIndex; si_6 = document.color.groomcolor.selectedIndex; si_7 = document.height.groomheight.selectedIndex; si_8 = document.marriage.groommarriage.selectedIndex; si_9 = document.father.groomfather.selectedIndex; if (document.age.groomage.options[si].text = " "; alert ('Please select Groom's Age'); if (document.caste.groomcaste.options[si_1].text = " "; alert ('Please select Groom's Caste'); if (document.profession.groomprofession.options[si_2].text = " "; alert ('Please select Groom's Profession'); if (document.bachelor.groombachelor.options[si_3].text = " "; alert ('Please select Groom's Salary'); if (document.doc.groomdoc.options[si_4].text = " "; alert ('Please select Groom's Alma Mater'); if (document.country.groomcountry.options[si_5].text = " "; alert ('Please select the country where Groom lives'); if (document.color.groomcolor.options[si_6].text = " "; alert ('Please select Groom's Skin Color); if (document.height.groomheight.options[si_7].text = " "; alert ('Please select Groom's Height'); if (document.marriage.groommarriage.options[si_8].text = " "; alert ('Please select number of times the Groom has married'); if (document.father.groomfather.options[si_9].text = " "; alert ('Please select Groom's Father's Profession'); } I would appreciate any kind of help. Thanks! Hi All, I am really stumped. I am not sure why it's not working. Basically, selecting a country will pre-populate the state field for both billing and shipping sections. Please help! Also, when copying the billing info from shipping, the state field doesn't seem to copy over. I have attached the entire code as a text file (part1 + part2 = complete code). Thanks! I use a ticketing website at a call center. I have javascript injection bookmarks with some of the more common issues, but my issue is even after I populate everything when I try to submit the ticket, it won't recognize that somethign is there unless i go through and hit enter in each form i autopopulated. javascript:if((top.arid1000000000.value="Inquiry - ")!=""); Most are drop down lists. Is there any way to submit each form(when i hit enter) after the text gets entered in there? I am working on a website that involves a pizza. I have a drop down box with the following options: small, medium, large, and extra large. When the user selects small the topping price is $0.75 each, when the user selects medium the topping price is $1.00 each, when the user selects large the topping price is $1.25 each, and when the user selects extra large the topping price is $1.25 each. I the problem is no matter what size the user selects the topping price is always $0.75. Here is code that goes with the drop down box : Code: <td height="49" align="right"><label for="Pizza_Size">Size</label> <select name="Pizza_Size" id="Pizza_Size" onchange = "SetToppingPrice()" /> <option value="Small_Pizza">Small ($4.99)</option> <option value="Medium_Pizza">Medium ($5.99)</option> <option value="Large_Pizza">Large ($7.99)</option> <option value="X_Large_Pizza">X-Large ($10.99)</option> </select></td> Here is the Javascript code: Code: // JavaScript Document function SetToppingPrice() { var Pizza_Topping_Price = document.getElementById("Pizza_Size"); divOutput = document.getElementById("Display_Topping_Price"); if(Pizza_Topping_Price = "Small_Pizza") { divOutput.innerHTML = "$0.75 per topping";} else if (Pizza_Topping_Price = "Medium_Pizza") { divOutput.innerHTML = "$1.00 per topping";} else if (Pizza_Topping_Price = "Large_Pizza") { divOutput.innerHTML = "$1.25 per topping";} else if (Pizza_Topping_Price = "X_Large_Pizza") { divOutput.innerHTML = "$1.50 per topping";} } Any advice is greatly appreciated. Hi everyone, The website that I am trying to create has a couple of drop down lists. I want a variable to store the value (text) of the data field selected from a particular drop down list. Let me explain this with an example: If a dropdown list has data fields like (aa, bb, cc, dd, ee) and if a user selects the option 'bb' , then there should be a variable that stores the text 'bb'. I am using the following piece of code. Can you please take a look at it to tell whether I am doing the correct thing or not. Firstly, the HTML code that generates the drop down list on the page. This works fine. Code: <b> Student's Profession</b> <FORM NAME="Profession"> <SELECT NAME="Student’s Profession"> <OPTION VALUE="k1">Select <OPTION VALUE="k2">Engineer <OPTION VALUE="k3">Doctor <OPTION VALUE="k4">IAS <OPTION VALUE="k5">Lawyer <OPTION VALUE="k6">CA <OPTION VALUE="k7">IAS <OPTION VALUE="k8">Engineer + MBA <OPTION VALUE="k9">Family Business <OPTION VALUE="k10">None of the above </SELECT> </FORM> [Then I have declared a function in JavaScript that stores the value of the data field selected in a particular variable (sel_student_profession). I am not sure about the parameter. Should I simply write 'dropdown' or write the form name? (Profession). Or something else? Code: <script type="text/javascript"> function Selected_profession(dropdown) { var myindex = Profession.selectedindex; var sel_student_profession = Profession.options[myindex].text; return sel_student_profession; } </script> And then at the end of it, if I want to know the value (text) of the data field selected, I call the function. Right now, I am calling the function as follows: Code: var student_profession = Selected_profession(Profession); So, if the user selects "engineer" from the drop down list, student_profession should store "engineer". Am I doing it the correct way? If not, I would highly appreciate any sort of help. Thanks a lot! Hey everyone I'm new here and I have a question about the best way to execute this task. I am trying to create a page with a dropdown list where the user selects the state. A drop down list below that can have the specific schools to that state to choose from. Now I need a way for the user to click on a school and then be taken to a page that has website URL's from all the fraternities in that school. Do I need php and mysql? I don't want to create a million pages unless I have to. What is the easiest way to do this. Maybe some kind of central form things where it outputs the fraternity you want at a particular school and state. Also I am using tumblr but can just link it to a normal html or php page just throwing that out there. Thanks guys! Thomas I am creating a quote calculator as a mobile app using the JQuery Mobile plugin in Dreamweaver CS5.5. This supports HTML5 & Javascript. I have included a drop down list in which the user selects a specific Annual Volume. I have 2 different calculations that need to be done based on the users selection. Different calculations meaning that I need 2 different number values assigned to the option. For Example: Calculation #1 (I'm calculating what the Run Quantity is based on what the user selects as the Annual Volume. If user selects an Annual Volume of 150,000 then the calculated result for Run Quantity needs to be 3500) HTML for this scenario: Code: <li data-role="fieldcontain"> <p><span class="ui-listview-inset">Annual Volume:</label> <select name="annualvolume" id="annualvolume"> onChange="Calculate();"> <option value="1000">10,000</option> <option value="2000">30,000</option> <option value="3500">150,000</option> <option value="6000">300,000</option> <option value="10000">500,000</option> <option value="20000">1,000,000</option> </select> </p> </li> Calculation #2 (within the same form as the above calculation, I also need to calculate what the Annual Sales will be. The math to calculate the Annual Sales is to multiply the Final Piece Price (which is another calculation within this form) with Annual Volume. However with this Calculation # 2 I need the value to be 150,000 when user selects 150,000 and NOT 3500 as it was before. I've tried tweaking the HTML in following manner to assign 2 values within the same drop down, but it didn't work correctly. Code: <option value="3500" amount="150000">150,000</option> My javascript is as follows (please note that I deleted all the result fields except for the 3 that reference my described calculations above. My actual calculator has over 20 results all based on the user's inputs. This is why there are so many variables listed in my javascript - they are for the other results) Code: <SCRIPT LANGUAGE="JavaScript"> function CalculateSum(Atext, Btext, materialtype, presstype, Etext, Ftext, annualvolume, annualvolume2,Htext, Itext, form) { //INPUTS var A = parseFloat (Atext); var B = parseFloat (Btext); var C = document.getElementById('materialtype').value; var D = document.getElementById('presstype').value; var E = parseFloat (Etext); var F = parseFloat (Ftext); var G = document.getElementById('annualvolume').value; var GA = document.getElementById('annualvolume').amount; var H = parseFloat (Htext); var I = parseFloat (Itext); //RESULTS form.RunQuantity.value = G form.FinalPiecePrice.value = (((C*A) + F) + ((D/G) + E) + (((C*A) + F) + ((D/G) + E )) * (H *.01) + (((C*A) + F) + ((D/G) + E ) + (((C*A) + F) + ((D/G) + E )) * (H *.01)) * (I *.01)) form.AnnualSales.value = (form.FinalPiecePrice.value * GA) } </script> Currently I am simply having the user enter the annual volume twice so I can do the 2 calculations, but this is really clunky and not ideal. I'm fairly new to Javascript but have learned a lot from reading other posts by people like you. This is the first thing I haven't been able to figure out on my own and any help would be greatly appreciated. Hi, I've checked the boards and was unable to find something that matched the code that I have. The code basically uses radio buttons to populate results to a drop-down list depending on the radio button they choose. I'm having trouble figuring out where and how to add the redirection url for each of the value choices in the drop down. I was told something about using window.location('http://url.here') and then to populate the location parameter with the array value. Does this mean I have to redo my script or can another piece of code be added on to make it work. How do I alter my existing code? Thanks in advance for any help I can get: Code: <!DOCTYPE html> <html lang="en"> <head> <script type="text/javascript"> var services = new Array(); services['Tutoring'] = ['Grady', 'Holy Innocents', 'North Springs', 'Paideia', 'Riverwood', 'School Not Listed?']; services['Recording'] = ['John Doe']; function changechoice(choice) { var serviceList = services[choice]; changeSelect('service', serviceList, serviceList); document.getElementById('service').disabled = false; document.getElementById('service').onchange(); } function changeservice(serviceValue) { document.getElementById('output').innerHTML = serviceValue; return; } function changeSelect(fieldID, newValues, newOptions) { selectField = document.getElementById(fieldID); selectField.options.length = 0; if (newValues && newOptions) { for (i=0; i<newValues.length; i++) { selectField.options[selectField.length] = new Option(newOptions[i], newValues[i]); } } } </script> </head> <body> <table width="400" align="center" colspan="2" border="0" rowspan="2"> <tr> <td width="200" align="left"> Pick an option: </td> </tr> <td width="200"> <br> <ul> <input type="radio" name="choice" value="Tutoring" onclick="changechoice(this.value);"> Tutoring<br /> <input type="radio" name="choice" value="Recording" onclick="changechoice(this.value);"> Recording<br /> </ul> </td> <br> <td width="200" align="center" valign="top"> <br> <select name="service" id="service" onchange="changeservice(this.value);" disabled="disabled"> <option> -- Choose an Option -- </option> </select> </td> </table> </body> </html> I have the code below and currently the user selects an option and clicks the go button and this links to the webpage in a new window, however I am wanting this to open in the same window instead, any help? Code: <html> <body><script> function goToNewPage(dropdownlist) { var url = dropdownlist.options(dropdownlist.selectedIndex).value; if (url != "") { window.open(url); } } </script> <p>Test</p> <form name="dropdown"><select accesskey="E" name="list"> <option selected="selected">Please select....</option> <option value="http://www.google.com/">Google</option> <option value="http://www.search.com/">Search.com</option> <option value="http://www.dogpile.com/">Dogpile</option></select> <input onclick="goToNewPage(document.dropdown.list)" type="button" value="Go" /></form> </body></html> Hi. Please help in validating both a drop down list and textbox if the other is not empty alert message will pop-up and vice versa. The validation will be such as follows: 1. If each drop down list is selected and the textbox next to it is not equal to 0 or not empty, DO NOTHING. 2. If drop down list is not selected and textbox is empty DO NOTHING. Below condition will check if both drop down list and textbox if one of the other is empty then message will appear: 3. If drop down list is selected or index is not equal to 0 AND textbox is empty or equal to 0, alert will pop-up. 4. If drop down list is not selected or index is equal to 0 AND textbox is not empty or not equal to 0, alert will pop-up. I guess with the condition above will validate each drop down list and textboxes show to each other. Below is my code that I use and it doesn't work. Please help making it work. Of course I didn't include the <script tag> but it is oncluded in the original page. Thanks. Code: function validation_OK(iRows,iCols) { var iRows; var iCols; var desigamt = new Array(iRows); desigamt[0] = Number(document.getElementById('i').value); desigamt[1] = Number(document.getElementById('j').value); desigamt[2] = Number(document.getElementById('k').value); desigamt[3] = Number(document.getElementById('l').value); desigamt[4] = Number(document.getElementById('m').value); desigamt[5] = Number(document.getElementById('n').value); desigamt[6] = Number(document.getElementById('o').value); desigamt[7] = Number(document.getElementById('p').value); desigamt[8] = Number(document.getElementById('q').value); desigamt[9] = Number(document.getElementById('r').value); var i; var j; for (i=0; i < iRows; i++) { desigamt[i] = new Array(iCols); iCols[0] = document.getElementById('I').value; iCols[1] = document.getElementById('J').value; iCols[2] = document.getElementById('K').value; iCols[3] = document.getElementById('L').value; iCols[4] = document.getElementById('M').value; iCols[5] = document.getElementById('N').value; iCols[6] = document.getElementById('O').value; iCols[7] = document.getElementById('P').value; iCols[8] = document.getElementById('Q').value; iCols[9] = document.getElementById('R').value;; for (j=0; j < iCols; j++) { if(a[i][j] = "" || a[i][j] != "") { return true; } else { if (a[i].selectedIndex!=0 && a[j].value == "") { var answer = confirm("Please enter the amount to designate on the selected partner agency. Clicking the CANCEL button will delete the partner agency selected. Do you want to continue?") if (answer) { a[j].focus(); } else { a[i].selectedIndex=0; } } else { var answer = confirm('Please select a partner agency to designate the amount you entered. Clicking the CANCEL button will delete the amount you entered. Do you want to continue?') if (answer) { a[i].focus(); } else { a[j].value=0; } } } } } return (desigamt); } Below is my html code. FYI: I have lots of function included and this function I am trying to make it work is one of them. Please help!!!!! Code: <table> <tr> <td> <select id="I" name="I" size="1" style="overflow-x:scroll; width:380px; " onchange="return validation_OK();"> <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['I']); ?> value="<?php echo $prompt; ?>"><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="i" name="i" class="text" type="text" value="<?php safeEcho($form['i'])?>" style="width:90px;" onChange="CalculateTotal();return validation_OK();" /> <?php helper_error('i');?> </td> </tr> <tr> <td> <select id="J" name="J" size="1" style="overflow-x:scroll; width:380px; " onchange="return validation_J();"> <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['J']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="j" name="j" class="text" type="text" value="<?php safeEcho($form['j'])?>" style="width:90px;" onChange="CalculateTotal();return validation_J();" /> <?php helper_error('j');?> </td> </tr> <tr> <td> <select id="K" name="K" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['K']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="k" name="k" class="text" type="text" value="<?php safeEcho($form['k'])?>" style="width:90px;" onChange="CalculateTotal()" /> <?php helper_error('k');?> </td> </tr> <tr> <td> <select id="L" name="L" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['L']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="l" name="l" class="text" type="text" value="<?php safeEcho ($form['l'])?>" style="width:90px;" onChange="CalculateTotal()" /> <?php helper_error('l');?> </td> </tr> <tr> <td> <select id="M" name="M" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['M']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="m" name="m" class="text" type="text" value="<?php safeEcho($form['m'])?>" style="width:90px;" onChange="CalculateTotal();" /> <?php helper_error('m');?> </td> </tr> <tr> <td> <select id="N" name="N" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['N']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="n" name="n" class="text" type="text" value="<?php safeEcho($form['n'])?>" style="width:90px;" onChange="CalculateTotal();" /> <?php helper_error('n');?> </td> </tr> <tr> <td> <select id="O" name="P" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['O']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="o" name="o" class="text" type="text" value="<?php safeEcho($form['o'])?>" style="width:90px;" onChange="CalculateTotal();" /> <?php helper_error('o');?> </td> </tr> <tr> <td> <select id="P" name="P" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['P']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="p" name="p" class="text" type="text" value="<?php safeEcho($form['p'])?>" style="width:90px;" onChange="CalculateTotal();"/> <?php helper_error('p');?> </td> </tr> <tr> <td> <select id="Q" name="Q" size="1" style="overflow-x:scroll; width:380px; " > <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['Q']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="q" name="q" class="text" type="text" value="<?php safeEcho($form['q'])?>" style="width:90px;" onChange="CalculateTotal();" /> <?php helper_error('q');?> </td> </tr> <tr> <td> <select id="R" name="R" size="1" style="overflow-x:scroll; width:380px; "> <option>Click to select...</option> <?php foreach ($designation_list as $descode => $prompt) : ?> <option <?php echo helper_selected($descode == $form['R']); ?> value="<?php echo $prompt; ?>" ><?php safeEcho($descode); ?> </option> <?php endforeach; ?> </select> </td> <td> $<input id="r" name="r" class="text" type="text" value="<?php safeEcho($form['r'])?>" style="width:90px;" onChange="CalculateTotal();" /> <?php helper_error('r');?> </td> </tr> </table> I hope you can help me. Thanks a lot. This is the code that I have:- Code: ListItem[1] = new Option("A List Item", "listitem1"); ListItem[1].style.display = "none"; The first line creates a new entry in the list, I am wanting the second line to remove the same item but it doesn't work. I have tried this:- Code: ListItem[1] = new Option(""); But that leaves a blank line entry in the list Cheers Daniel. Hi I saw on a site one drop down list and i wanted to make it auto change. I mean i have this list in my database and everytime i need to change the date manually. Is it possible that these dates changes every day it display as below but it auto change with day.? and not have Saturday and Sunday in them. Thanks for any help : PHP Code: <select name = "date" value="<?php echo "$date" ?>" id = "date" STYLE="width: 200px; border:1px solid #4088b8; color:#111111; font-family:Arial; background:#ffffff;"> <option value="0" >Please Select</option> <option value="02/11/2009 - Monday" >02/11/2009 - Monday</option> <option value="03/11/2009 - Tuesday" >03/11/2009 - Tuesday</option> <option value="04/11/2009 - Wednesday" >04/11/2009 - Wednesday</option> <option value="05/11/2009 - Thursday" >05/11/2009 - Thursday</option> <option value="06/11/2009 - Friday" >06/11/2009 - Friday</option> <option value="07/11/2009 - Monday" >09/11/2009 - Monday</option> <option value="08/11/2009 - Tuesday" >10/11/2009 - Tuesday</option> <option value="09/11/2009 - Wednesday" >11/11/2009 - Wednesday</option> <option value="10/11/2009 - Thursday" >12/11/2009 - Thursday</option> <option value="11/11/2009 - Friday" >13/11/2009 - Friday</option> <option value="14/11/2009 - Monday" >16/11/2009 - Monday</option> <option value="15/11/2009 - Tuesday" >17/11/2009 - Tuesday</option> <option value="16/11/2009 - Wednesday" >18/11/2009 - Wednesday</option> <option value="17/11/2009 - Thursday" >19/11/2009 - Thursday</option> <option value="18/11/2009 - Friday" >20/11/2009 - Friday</option> <option value="21/11/2009 - Monday" >23/11/2009 - Monday</option> <option value="22/11/2009 - Tuesday" >24/11/2009 - Tuesday</option> <option value="23/11/2009 - Wednesday" >25/11/2009 - Wednesday</option> <option value="24/11/2009 - Thursday" >26/11/2009 - Thursday</option> <option value="25/11/2009 - Friday" >27/11/2009 - Friday</option> <option value="28/11/2009 - Monday" >30/11/2009 - Monday</option> <option value="29/11/2009 - Tuesday" >01/12/2009 - Tuesday</option> <option value="30/11/2009 - Wednesday" >02/11/2009 - Wednesday</option> <option value="01/12/2009 - Thursday" >03/12/2009 - Thursday</option> <option value="02/12/2009 - Friday" >04/12/2009 - Friday</option> </select> Best Wishes |