HTML - Html Forms (dropdown List)
Hello all,
I have created a dropdown list in a form using the <select> tag. My question is, is there any way to have that dropdown list display a different <option> as the default option when the page loads? The default option right now is always whatever option is the first one in my code. EX. <select> <option value="1">1</option> //by default this first option shows up on page load <option value="2">2</option> <option value="3">3</option> //can I have this option show up instead by default? </select> Thanks in advance. Similar TutorialsHi, I am using css to create a dropdown menu. It works fine in all browsers except IE6. In IE6 a dropdown list covers the dropdown menu. please see the atachment/screenshot. Here is the html/css code I am using. HTML Code: { position: relative; z-index: 1;}*/ ul.dropdown, ul.dropdown li, ul.dropdown ul { list-style: none; margin: 0; padding: 0; } ul.dropdown { position: relative; z-index: 597; float: left; } ul.dropdown li { float: left; line-height: 1.3em; vertical-align: middle; zoom: 1; z-index: 599; } ul.dropdown li.hover, ul.dropdown li:hover { position: relative; z-index: 599; cursor: default; } ul.dropdown ul { visibility: hidden; position: absolute; top: 100%; left: 0; z-index: 598; width: 100%; } ul.dropdown ul li { float: none; z-index: 598; } ul.dropdown ul ul { top: 1px; left: 99%; z-index: 598; } ul.dropdown li:hover > ul { visibility: visible; z-index: 598; } HTML Code: <div id="header" class="header" style="background-image: url(./images/blue-curve.jpg); background-position: top;"> <h1> Finance and Risk </h1> <ul class="dropdown dropdown-horizontal noPrint"> <li><a href="#" class="dir">Data Management</a> <ul> <?php echo '<li><a href="main.php?PageName=import3' . SID . '">Upload Data</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=list' . SID . '">Download Data</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=delete' . SID . '">Delete Data</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=assetupdate' . SID . '">Update Data</a></li>'; ?> </ul> </li> <li><a href="#" class="dir">Reports</a> <ul> <?php echo '<li><a href="main.php?PageName=reports' . SID . '">BS Overview</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=CDO' . SID . '">CDOs</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=impairment' . SID . '">Impairments</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=fvecapreport' . SID . '">FairValue and Risk</a></li>';?> <?php echo '<li><a href="main.php?PageName=creditrisk' . SID . '">Credit Default Risk</a></li>';?> <?php echo '<li><a href="main.php?PageName=securitydata' . SID . '">MarketData</a></li>';?> </ul> </li> <li><a href="#" class="dir">Files & Manuals</a> <ul> <?php echo '<li><a href="magnitude.pdf" target="_blank">Product Codes</a></li>';?> <?php echo '<li><a href="uploadmanual.pdf" target="_blank">Upload Manual</a></li>';?> <?php echo '<li><a href="main.php?PageName=osmdocs' . SID . '">OSM Files</a></li>'; ?> </ul> </li> <li><a href="#" class="dir">Miscellaneous</a> <ul> <?php echo '<li><a href="main.php?PageName=creditcrises' . SID . '">Credit Crises</a></li>'; ?> </ul> </li> <?php if ($_SESSION['Admin'] == "Yes") { ?> <li><a href="#" class="dir">Admin </a> <ul> <?php echo '<li><a href="main.php?PageName=message' . SID . '">Flash Alerts</a></li>'; ?> <?php echo '<li><a href="testmarcel1.php?' . SID . '">Test Marcel1</a></li>'; ?> <?php echo '<li><a href="testmarcel2.php?' . SID . '">Test Marcel2</a></li>'; ?> <?php echo '<li><a href="testmarcel3.php?' . SID . '">Test Marcel3</a></li>'; ?> <?php echo '<li><a href="main.php?PageName=testajay1' . SID . '">Test Ajay1</a></li>'; ?> <?php echo '<li><a href="testajay2.php?' . SID . '">Test Ajay2</a></li>'; ?> <?php echo '<li><a href="testajay3.php?' . SID . '">Test Ajay3</a></li>'; ?> </ul> </li> <?php } ?> <li><a class="dir" href="main.php?PageName=menu">Menu</a> <ul> <?php echo '<li><a href="logout.php">Logout</a></li>'; ?> <?php echo '<li><a href="#">Change password</a> </li>'; ?> </ul> </li> <li><a class="dir" href="javascript:window.print()" color="green">Print</a> </li> </ul> </div> Any one has an idea how to get the css menu on top of the dropdown list? Thanks in advance Greetings; Can someone spot my error he My webpage has 4 dropDown Menu FORMs. DropDown Menu FORMs 1,3 and 4, work fine. But clicking on FORM/Menu #2 does nothing. Very troubling. Can someone spot my error below? Thanks...vmars : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> Your Title Here </title> <meta name="Generator" content="AlleyCode HTML Editor"> <meta name="Description" content="Your description here..."> <meta name="Description" content="...Created by ddMenu % HotBasic..."> <meta name="Keywords" content="Your keywords here..."> </head> <body> <div align="center"> <table> <tr> <td align="center"> <form name="HotBasic"> <select style="font-size:16px;color:#006699;font-family:tahoma;background-color:#ffffff;" name="menu" onChange="location=document.HotBasic.menu.options[document.HotBasic.menu.selectedIndex].value;"> <option value="">HotBasic</option> <option value="http://tech.groups.yahoo.com/group/hotbasic/">HotBasic Group @ Yahoo</option> <option value="http://mypages.cwdom.dm/keenej/hotbasic.html">HotBasic Home Page</option> </select></form> </td> <td align="center"> <form name="YouTube Related"> <select style="font-size:16px;color:#006699;font-family:tahoma;background-color:#ffffff;" name="menu" onChange="location=document.YouTube Related.menu.options[document.YouTube Related.menu.selectedIndex].value;"> <option value="">YouTube Related</option> <option value="http://www.youtube.com/">YouTube.com</option> <option value="http://www.downloader9.com/">Save YouTube videos to AVI</option> <option value="http://www.getaudiofromvideo.com/">YouTube to Mp3</option> </select></form> </td> </tr> <tr> <td align="center"> <form name="Euphoria"> <select style="font-size:16px;color:#006699;font-family:tahoma;background-color:#ffffff;" name="menu" onChange="location=document.Euphoria.menu.options[document.Euphoria.menu.selectedIndex].value;"> <option value="">Euphoria</option> <option value="http://openeuphoria.org/EUforum/index.cgi">OpenEuphoria.org</option> <option value="http://docs.wxwidgets.org/stable/wx_wxboxsizer.html">wxWidgets wxBoxSizer</option> <option value="http://docs.wxwidgets.org/stable/wx_wxscrolledwindow.html">wxWidgets Docs wxScrolledWindow</option> <option value="http://docs.wxwidgets.org/stable/wx_sizeroverview.html">wxWidgets Programming with wxBoxSizer</option> </select></form> </td> <td align="center"> <form name="AutoIt3"> <select style="font-size:16px;color:#006699;font-family:tahoma;background-color:#ffffff;" name="menu" onChange="location=document.AutoIt3.menu.options[document.AutoIt3.menu.selectedIndex].value;"> <option value="">AutoIt3</option> <option value="http://www.autoitscript.com/forum/index.php?showforum=2">AutoIt3 General Help and Support</option> <option value="http://www.autoitscript.com/forum/index.php?showforum=10">GUI Help and Support Forum</option> <option value="http://www.autoitscript.com/forum/index.php?showforum=9">Example Scripts</option> </select></form> </td></tr> </table> </div> </body> </html> Hi all i would like to know how to create a combobox/dropdown box that the user can use to up grade options on a pc and the price change with it? here is an example http://www.gr-tek.com.au/proddetail.php?prod=Corei3 many thanks Nick Hey guys, I'm having a little problem. My client is being very picky and he doesn't like the way his "form dropdown box unfurls". I did some research and I can't seem to find a way to changed the speed or way that the dropdown box drops down. Can someone help me out? Thank in advance! Aaron ok i have this code it works fine for what i want but also id like to add in when the option is selected to have an alert that pops up acording to what option was selected Code: <html> <head> <title>Tech Support</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <form> <select onchange="this.form.solu.value=this.options[this.selectedIndex].value"> <option value="" selected>Select from Drop Down List</option> <option value="Plug in the Computer">No Power</option> <option value="Turn on the Monitor">Screen is Dark</option> </select><br> <br> <table> <tr> <td valign="top">Solution:</td> <td><textarea name="solu" rows="3" cols="30"></textarea></td> </tr> </table> </form> </body> </html> I am trying to make two drop down list boxes (each with a "Enter" button), but I can't get them both to work. The second list box works fine, but the "Enter" button from the first box uses the selection of the second box as its reference. Does anyone know why this is happening? Below is the code that I am using. Code: </ br> <h1 style="text-align: center;">View Routes</h1> <p style="text-align: center;">Browse By Location:</ br><script type="text/javascript"> function submitForm() { var list = document.navList.subMenu; var page = list.options[ list.selectedIndex ].value; if (page != "home") window.location = page; return false; } </script> <form style="text-align: center" name="navList" onsubmit="return submitForm();"> <select name="subMenu"> <option value="home"> </option> <option value="http://climb-utah.modern-graphix.com/bryce-national-park">Bryce National Park</option> <option value="http://climb-utah.modern-graphix.com/capitol-reef-national-park">Capitol Reef National Park</option> <option value="http://climb-utah.modern-graphix.com/cedar-mesa">Cedar Mesa</option> <option value="http://climb-utah.modern-graphix.com/escalante-grand-staircase">Escalante Grand Staircase</option> <option value="http://climb-utah.modern-graphix.com/lake-powell-area">Lake Powell Area</option> <option value="http://climb-utah.modern-graphix.com/miscellaneous">Miscellaneous</option> <option value="http://climb-utah.modern-graphix.com/moab-area">Moab Area</option> <option value="http://climb-utah.modern-graphix.com/robbers-roost">Robbers Roost</option> <option value="http://climb-utah.modern-graphix.com/san-rafael-swell">San Rafael Swell</option> <option value="http://climb-utah.modern-graphix.com/wasatch-mountains">Wasatch Mountains</option> <option value="http://climb-utah.modern-graphix.com/uinta-mountains">Uinta Mountains</option> <option value="http://climb-utah.modern-graphix.com/valley-of-fire">Valley Of Fire</option> <option value="http://climb-utah.modern-graphix.com/zion-national-park">Zion National Park</option> </select> </ br> <input type="submit" value="Enter" /> </form> <p style="text-align: center;">Browse By Category:</p><script type="text/javascript"> function submitForm() { var list = document.navCat.subMenuCat; var page = list.options[ list.selectedIndex ].value; if (page != "home") window.location = page; return false; } </script> <form style="text-align: center" name="navCat" onsubmit="return submitForm();"> <select name="subMenuCat"> <option value="home"> </option> <option value="http://climb-utah.modern-graphix.com/family-fun">Family Fun - Easy</option> <option value="http://climb-utah.modern-graphix.com/weekend-warrior">Weekend Warrior - Moderate</option> <option value="http://climb-utah.modern-graphix.com/hardcore">Hardcore - Difficult</option> <option value="http://climb-utah.modern-graphix.com/technical">Technical - Highly Skilled</option> <option value="http://climb-utah.modern-graphix.com/adventure-tales">Adventure Tales - Stories</option> <option value="http://climb-utah.modern-graphix.com/video-audio-clips">Video & Audio Clips</option> <option value="http://climb-utah.modern-graphix.com/other-stuff">Other Stuff</option> </select> </ br> <input type="submit" value="Enter" /> </form> I'm a noob so please forgive me if this is a stupid question or if the info is listed somewhere else. I really did try and find it on my own. I'm trying to make a simple website that incorporates amazon's free "astore". It has a search function included in the sidebar already but i don't like it and really want to set up my own. I found this search box code: Quote: <form action="http://astore.amazon.com/adbabel-20/search" method="get" target="_blank"> <input name="node" value="8" type="hidden"> <input name="keywords" size="12" value="" type="text"> <button type="submit" >Search</button> </form> it works well but is limited to searching only one category in my store (i have several). each category is assigned a "node" number. By changing the node value in the code I can change which category the box searches. I want to create a drop down list that, upon selection, changes the node value and thus the category that is to be searched. Can anyone let me know how this might be done? I'm trying to change a paypal form code I want to set up 4 radio buttons(payment plans). Each of the buttons I'd like to change the value part of this line <input type="hidden" name="amount" value="1.00"> into different amounts(chosen by me) how might i go about doing this? Hello....long time viewer of this site....love it....learnt so much I have a question.... I used emailmeform.com to create my form for my site, but wanted to use my server instead of theirs.......Can't find a way around in the code I have a feeling this is what I need to change: "http://www.emailmeform.com/fid.php?formid=119926" How do I cut them out of the picture so that the form is submitted straight to my email? Here it is as it stands: <form method="post" action="http://www.emailmeform.com/fid.php?formid=119926" enctype="multipart/form-data" accept-charset="UTF-8"> <table width="659" border="0" cellpadding="2" cellspacing="0" bgcolor="#FFFFFF"> <tr> <td width="480"> <p><font face="Verdana" size="2" color="#000000">Please help the site remain free and fill out the survey.</font></p> <p><font color="#000000" size="2" face="Verdana">Universal password for all eBooks will be emailed to you immediatley</font></p> <p class="style14"><font color="#000000" face="Verdana">*please read our <a href="TOS.html" title="TOS">terms of service</a> before submitting the survey</font></p> <div style="" id="mainmsg"> </div> </td> </tr> </table> <br> <table cellpadding="2" cellspacing="0" border="0" bgcolor="#FFFFFF"> <tr valign="top"> <td width="170" nowrap><font face="Verdana" size="2" color="#000000"><br /> Your Name</font><br /> <br /></td> <td width="351"> <br /> <input type="text" name="FieldData0" value="" maxlength="100" size="30"> <span class="style15"> *required</span> </td> </tr> <tr valign="top"> <td nowrap><font face="Verdana" size="2" color="#000000"><br /> Your Email Address<br /> <br /> </font></td> <td> <br /> <input type="text" name="FieldData1" value="" maxlength="100" size="30"> <span class="style15"> *required</span> </td> </tr> <tr valign="top"> <td nowrap><font face="Verdana" size="2" color="#000000"><br /> Phone Number<br /> <br /> </font></td> <td> <br /> <input type="text" name="FieldData2" value="" maxlength="100" size="30"> <span class="style15"> *required</span> </td> </tr> <tr valign="top"> <td nowrap><font face="Verdana" size="2" color="#000000"><br /> Interested In<br /> <br /> </font></td> <td><br /> <input type=checkbox name="FieldData3-0" value="Shares" id="check30"><font face="Verdana" size="2" color="#000000"><label for="check30">Shares</label></font><br><input type=checkbox name="FieldData3-1" value="Options" id="check31"><font face="Verdana" size="2" color="#000000"><label for="check31">Options</label></font><br><input type=checkbox name="FieldData3-2" value="CFDs" id="check32"><font face="Verdana" size="2" color="#000000"><label for="check32">CFDs</label></font><br><input type=checkbox name="FieldData3-3" value="Futures" id="check33"><font face="Verdana" size="2" color="#000000"><label for="check33">Futures</label></font><br><input type=checkbox name="FieldData3-4" value="FX" id="check34"><font face="Verdana" size="2" color="#000000"><label for="check34">FX</label></font><br><input type=checkbox name="FieldData3-5" value="Other" id="check35"><font face="Verdana" size="2" color="#000000"><label for="check35">Other</label></font><br> </td> </tr> <tr valign="top"> <td nowrap><font face="Verdana" size="2" color="#000000"><br /> Amount availiable to invest<br /> </font></td> <td> <br /> <input type=radio name="FieldData4" value="$0-$10k" id="radio40"><font face="Verdana" size="2" color="#000000"><label for="radio40">$0-$10k</label></font><br><input type=radio name="FieldData4" value="$10k-$25k" id="radio41"><font face="Verdana" size="2" color="#000000"><label for="radio41">$10k-$25k</label></font><br><input type=radio name="FieldData4" value="$25k-$50k" id="radio42"><font face="Verdana" size="2" color="#000000"><label for="radio42">$25k-$50k</label></font><br><input type=radio name="FieldData4" value="$50k-$200k" id="radio43"><font face="Verdana" size="2" color="#000000"><label for="radio43">$50k-$200k</label></font><br><input type=radio name="FieldData4" value="$200k+" id="radio44"><font face="Verdana" size="2" color="#000000"><label for="radio44">$200k+</label></font><br /> <br> </td> </tr> <tr valign="top"> <td nowrap><font face="Verdana" size="2" color="#000000"><br /> Currently trading through<br /> </font></td> <td> <br /> <input type="text" name="FieldData5" value="" maxlength="100" size="30"> <span class="style15">*optional</span></td> </tr> <tr valign="top"> <td nowrap><font face="Verdana" size="2" color="#000000"><br /> Experience<br /> </font></td> <td> <br /> <input type=radio name="FieldData6" value="Beginner" id="radio60"><font face="Verdana" size="2" color="#000000"><label for="radio60">Beginner</label></font><br><input type=radio name="FieldData6" value="Intermediate" id="radio61"><font face="Verdana" size="2" color="#000000"><label for="radio61">Intermediate</label></font><br><input type=radio name="FieldData6" value="Advanced" id="radio62"><font face="Verdana" size="2" color="#000000"><label for="radio62">Advanced</label></font><br> </td> </tr> <tr> <td colspan="2"></td> </tr> <tr> <td> </td> <td align="right"> <input type="text" name="hida2" value="" maxlength="100" size="3" style="display : none;"> <br /> <input type="submit" class="btn" value="Submit" name="Submit" /></td> </tr> <tr> <td colspan=2 align="center"> <br></td> </tr> </table> </form> Thanks so much! Hey Ppls I need a hand with a HTML form that i am doing, I have completed forms on various websites before and they have just sent with a confirmation to say that your query has been sent. Now i dont pretend to know everything or even a lil that there is to know about HTML, and i have taught myself everything i know, but when i was looking at this form everytime you hit submit it brings up everything in outlook, and i would much prefer it to send directly from the web site! HTML Code: <body> <form action="MAILTO:justabetterchat@hotmail.com" method="post" enctype="text/plain"> <LINK REL=STYLESHEET HREF="mystyles.css" TYPE="text/css"> <H2>Below is a easy to use form that we have made in order to continuously improve our chat! Feel free to give us feedback, make a query or even Complain about or compliment a staff member!</H2> Name:<br> <input type="text" name="name" value="Your Name" size="20"> </p> Mail:<br> <input type="text" name="mail" value="Your E-mail" size="20"> </p> Reason For Submission:<br> <select name="Reason for Submission"> <option value=""></option> <option value="General Inquiry">General Inquiry</option> <option value="Account Problems">Account Problems</option> <option value="Feedback">Feedback</option> <option value="Compliments and COmplaints">Compliments and Complaints</option> </select></p> Details of Query (if the query is about your account please include your username):<br> <textarea rows="10" cols="30">Details Go HERE!!!! </textarea><br> <input type="submit" value="Send"> <input type="reset" value="Reset"> </form> </body> </html> that is the code that i have for the form, it may not be the easiest or best but its what i know, its just as i have outlined it opens outlook wif everything you have imputed and u send from there, well for people like me i dont have outlook set up, i dont use outlook which is why i would much rather it not do that but just send straight from the site, it would be great if someone could help me! Cheers, Rissy I am trying to make an HTML form with each field having an up and a down button next to it. There will be a total of 32 fields in a 4 by 8 table. The fields will be numerical starting with a value of 0. Then you can add or subtract 1 by pushing the corresponding button. I have figured out how to make the individule field using this code: <form> <input type=text name=amount value=5> <input type=button value="up" onClick="javascript:this.form.amount.value++;"> <input type=button value="down" onClick="javascript:this.form.amount.value--;"> </form> I can do this 32 times inside each cell of the table. But obviously I cannot submit this type of form do to the fact that you would end up with a <form> tag inside of a <form> tag. Is there any way around this? So that I can have the fields with their up and down buttons and then in the end be able to press the submit button and have it send the results in a text document to an email address using a php formmail script. I have a series of questions related to forms via html. 1. I am creating an employment application form. The form is pretty long, and I would like to create a "next" button that would bring the applicant to the next section, however I don't want it to submit because I would like to keep the application together in one piece (I might not be able to tell what piece belongs to which applicant, etc.). 2. The dreaded "SUBMIT" button... I've tried all the tutorials on the web that I can find, but I'm not sure I know exactly what's going on. Excuse me, but I am a little bit slow. A thorough explanation of how to create a mailto: myemail@mywebsite.com would be awesome. I don't know how to make it work. I put the "mailto" script in my forms, but nothing happens when I click submit. I will be posting the custom HTML to my form once it is complete so you can copy/paste however you'd like. To contact me directly, just go to: www.happypetpaws.net and click on my "Live Support" button. I'll answer. Thank you for your help! hi i have a form that i want to send to emails the form ask for password , user name and secret question , the thing is that i only know html and nothing about cgi scripts so what i did was that i search in google for cgi scripts so i found many but now i dont know what to do do i have to have one page for the form like form.htm and another for the cgi script like form.php or form.asp ? both of this files have to go into my server who host my page ? can you please help me to solve this thank you . rocko Hi I am currently trying to create a form which has one textbox, two radio buttons and a submit button and when the submit button is selected it will open another page and show the text from the text box and also show which radio button was selected. Currently i have two web pages, Forms.html which will have the textbox, radio buttons and submit button. Then i ahve page.html which i want to show the results. Currently the code in the forms.html page is: Code: <form action="page.html" method="post"> <fieldset> <legend>Testing form</legend> <p><label for="name">Name</label> <input type="text" id="name" /></p> <p><label for="male">Male</label> <input type="radio" value="male" id="male" name="gender" /></p> <p><label for="male">Female</label> <input type="radio" value="female" id="Female" name="gender" /></p> <p class="submit"><input type="submit" value="Submit" /></p><br/> </fieldset> </form> On the page.html the code i have is: Code: <% 'declare the variables that will receive the values Dim text, male, female 'receive the values sent from the form and assign them to variables 'note that request.form("name") will receive the value entered 'into the textfield called name name=Request.Form("text") email=Request.Form("male") comment=Request.Form("female") 'let's now print out the received values in the browser Response.Write("text: " & text & "<br>") Response.Write("male: " & male & "<br>") Response.Write("female: " & female & "<br>") %> However when you select the submit button it does open page.html but it does not show the results. Does anyone know why this is? Have i written the code wrong? Thanks Jeskit Currently, I use MS FrontPage to build forms. I'd like to begin to move away from using FP extensions and just use FP for editing. I use several forms and I'd like to hear from anyone that can lead me to any freeware or shareware that I can use to build HTML forms instead of using FP's system. Whatever software I use for forms I'd like it to also include these 3 functions: 1. Allow for form error page 2. Allow for form acknowledgement page 3. Provide built in capability to send completed form data (via Submit) to specified email addresses. I've Googled this a few times but haven't been able to come up with what I'm looking for. I was hoping someone on this forum could help. Thanks i got assigned a task of creating a satifaction survey for the it department. i need help with this. is there any type of step by step guide out there. or better yet would anyone out there be able to create the form for me so i can insert into a web page? thanks! Hi guys, i wonder if there is anyone out there that can help me with something. I have tried to fix it but to no avail. I cannot see any issues with the HTML, especially within the form tag. The form was produced by a company for me, with a script so that it emails the information to an end user. The problem is this: When you try to click on the text field the cursor doesnt come up unless u move to the top of the box. This only occurs on the first four os so fields, then the rest are perfect. As a workround, i have set the value to some text, and when the user clicks on it it clears the form and this works fine, but if the user clicks away from the form, and hovers over the text box the same problem exists. The URL is www.ventureaircraftbrokering.com the form is on the main page. I have tried to compare the code but nothing i can see. Thanks to all concerned in advance. Bpjones I am totally new to web development. I have a project in which i have to make a form. It is not a simple form with only 2-3 input areas but a series of 3-4 pages to be filled by person to enter into database. I need a good software to design a form. pls suggest me one?? i tried front page but it is bull****. also i want to know that in my form I wantr that if user clicks a radio button then a part of form glows up and then user can fill out that options.(I mean to say that by clicking a particular radio button event ) thanks in advance Almon |