I am reseting a combo box based on another combo box. I have 2 combo boxes and when i am selecting 01 then second combo is enabled and when I am selecting an option from 2nd combo then a text box appears, and when i am selecting ‘please select’ from first combo then 2nd combo is auto reset(disabled), but why that text box is not disappearing?
When an option except first option is selected from second combo, I am populating a text box like :
$(function() {
//This hides all initial textboxes
$('label').hide();
$('#secondcombo').change(function() {
//This saves some time by caching the jquery value
var val = $(this).val();
//this hides any boxes that the previous selection might have left open
$('label').hide();
//This just opens the ones we want based off the selection
switch (val) {
case 'option1':
case 'option4':
case 'other':
$('#label1').show();
break;
}
});
//I'm not really sure why these are here
$("input").focus(function() {
$(this).next("span").fadeIn(500);
}).blur(function() {
$(this).next("span").fadeOut(1000);
});
});
HTML
<select id='firstcombo'>
<option value="">please select</option>
<option value="01">01</option>
<option value="02">02</option>
</select>
<select id='secondcombo' disabled="true">
<option value="_">- select -</option>
<option value="option1">data</option>
<option value="option2">data</option>
</select>
<label id="label1" for="option1">
<input type="text" id="option1" />
</label>
This is not hiding because there is no event for your first combo in this code.
You may use below code to hide this
This will work for you.