Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>of the top of my head.</p> <p>You would handle your javascript on the page, before you submit your form. </p> <p>step 1. reference jquery in your header step 2. on load, hide the second select, put this script beneath you reference jquery</p> <pre><code>&lt;script type="text/javascript"&gt; $(function () { $("#secondselect").hide() $("#firstselect").change(function () { if($(this).val() != 0){ $("#secondselect").show() } else { $("#secondselect").hide() } }); }); &lt;/script&gt; &lt;select id="firstselect" name="firstselect" &gt; &lt;option value="0"&gt;first&lt;/option&gt; &lt;option value="1"&gt;second&lt;/option&gt; &lt;option value="2"&gt;third&lt;/option&gt; &lt;option value="3"&gt;&lt;/option&gt; &lt;/select&gt; &lt;select id="secondselect" name="secondselect"&gt; &lt;option value="0"&gt;first&lt;/option&gt; &lt;option value="1"&gt;second&lt;/option&gt; &lt;option value="2"&gt;third&lt;/option&gt; &lt;option value="3"&gt;&lt;/option&gt; &lt;/select&gt; </code></pre> <p>Of the top of my head... but i'd do it something like that.</p> <p>Good luck.</p> <p>Oh... just a quick update.</p> <p>You could use a switch instead of an if like so, might be a bit tidier...</p> <p><strong>FROM</strong></p> <pre><code>if($(this).val() != 0){ $("#secondselect").show() } else { $("#secondselect").hide() } </code></pre> <p><strong>TO</strong></p> <pre><code>switch($(this).val()) { case '1': $("#secondselect").show(); break; case '1': //do something else... show a third dropdown instead //for instance... // $("#thirdselect").show(); alert('got to case 1'); //or if you use firebug or chrome, right click and inspect an element then click on Console and this log report should show console.log('got here, showing the log'); break; default: $("#secondselect").hide(); } </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