Show A Second Select Box Based On The Option Chosen In The First?
I have the following select drop down box:
Solution 2:
<script>
$(function(){
$('#s1').hide();
});
functioncall()
{
var check=$('#s2').val();
if(check=="Interlink")
{
$('#s1').show();
}
else { $('#s1').hide(); }
}
</script><selectname="selectcourier"requiredonchange="call();"id="s2" ><optionvalue="">Please Select</option><optionvalue="collection">Collection</option><optionvalue="Interlink">Interlink</option><optionvalue="DespatchBay">Despatch Bay</option><optionvalue="International">International</option></select><label>Select Shipping Courier:</label><selectname="selectcourier"requiredid="s1"><optionvalue="1">Please Select</option><optionvalue="2">Next Day</option><optionvalue="3">2-3 Day</option><optionvalue="3">Pre 12</option></select>
You can use the above code to achieve your task
Solution 3:
Just react on the event of changing the value of the first select.
If the value equals 'Interlink' display the second select - if the value is something else hide the second select.
<selectname="selectcourier"requiredonchange="document.getElementById('interlink_addition').style.display = (this.value=='Interlink' ? 'block' : 'none')"><optionvalue="">Please Select</option><optionvalue="collection">Collection</option><optionvalue="Interlink">Interlink</option><optionvalue="DespatchBay">Despatch Bay</option><optionvalue="International">International</option></select><divid="interlink_addition"style="display:none"><label>Select Shipping Courier:</label><selectname="selectcourier"required><optionvalue="1">Please Select</option><optionvalue="2">Next Day</option><optionvalue="3">2-3 Day</option><optionvalue="3">Pre 12</option></select></div>
Solution 4:
you can use ajax for this. write a ajax function to show second select box and call it on onChange event of the first select Box
Post a Comment for "Show A Second Select Box Based On The Option Chosen In The First?"