Note that there are some explanatory texts on larger screens.

plurals
  1. POForm - How to submit and go to url?
    text
    copied!<p>I have this form below which is perfect for my needs with dependent fields. What I would like to do is when someone selects one of the subcategories (ie: Beddings), they would then be transferred to a url (ex: www.beddings.com). But this is far beyond my understanding!</p> <p>Any help would be appreciated!</p> <p>Here is a demo of this form: <a href="http://www.tamilcodes.com/demopages/jsdropdownlist.html" rel="nofollow">http://www.tamilcodes.com/demopages/jsdropdownlist.html</a></p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;script language="javascript" type="text/javascript"&gt; function dropdownlist(listindex) { document.formname.subcategory.options.length = 0; switch (listindex) { case "Home Ware" : document.formname.subcategory.options[0]=new Option("Select Sub-Category",""); document.formname.subcategory.options[1]=new Option("Air-Conditioners/Coolers","Air- Conditioners/Coolers"); document.formname.subcategory.options[2]=new Option("Audio/Video","Audio/Video"); document.formname.subcategory.options[3]=new Option("Beddings","Beddings"); document.formname.subcategory.options[4]=new Option("Camera","Camera"); document.formname.subcategory.options[5]=new Option("Cell Phones","Cell Phones"); break; case "Education" : document.formname.subcategory.options[0]=new Option("Select Sub-Category",""); document.formname.subcategory.options[1]=new Option("Colleges","Colleges"); document.formname.subcategory.options[2]=new Option("Institutes","Institutes"); document.formname.subcategory.options[3]=new Option("Schools","Schools"); document.formname.subcategory.options[4]=new Option("Tuitions","Tuitions"); document.formname.subcategory.options[5]=new Option("Universities","Universities"); break; case "Books" : document.formname.subcategory.options[0]=new Option("Select Sub-Category",""); document.formname.subcategory.options[1]=new Option("College Books","College Books"); document.formname.subcategory.options[2]=new Option("Engineering","Engineering"); document.formname.subcategory.options[3]=new Option("Magazines","Magazines"); document.formname.subcategory.options[4]=new Option("Medicine","Medicine"); document.formname.subcategory.options[5]=new Option("References","References"); break; } return true; } &lt;/script&gt; &lt;/head&gt; &lt;title&gt;Dynamic Drop Down List&lt;/title&gt; &lt;body&gt; &lt;form id="formname" name="formname" method="post" action="submitform.asp" &gt; &lt;table width="50%" border="0" cellspacing="0" cellpadding="5"&gt; &lt;tr&gt; &lt;td width="41%" align="right" valign="middle"&gt;Category :&lt;/td&gt; &lt;td width="59%" align="left" valign="middle"&gt;&lt;select name="category" id="category" onchange="javascript: dropdownlist(this.options[this.selectedIndex].value);"&gt; &lt;option value=""&gt;Select Category&lt;/option&gt; &lt;option value="Home Ware"&gt;Home Ware&lt;/option&gt; &lt;option value="Education"&gt;Education&lt;/option&gt; &lt;option value="Books"&gt;Books&lt;/option&gt; &lt;/select&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="right" valign="middle"&gt;Sub Category : &lt;/td&gt; &lt;td align="left" valign="middle"&gt;&lt;script type="text/javascript" language="JavaScript"&gt; document.write('&lt;select name="subcategory"&gt;&lt;option value=""&gt;Select Sub- Category&lt;/option&gt; &lt;/select&gt;') &lt;/script&gt; &lt;noscript&gt;&lt;select name="subcategory" id="subcategory" &gt; &lt;option value=""&gt;Select Sub-Category&lt;/option&gt; &lt;/select&gt; &lt;/noscript&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload