Get immediate nect drop down to the current dropdown
Here is my HTML Code.
<table>
<tr>
<select class="dropdown">
<option value="">Select answer</option>
<option value="1" selected="selected">A</option>
<option value="2">B</option>
<option value="3">C</option>
</select>
</td>
<td>
<select class="dropdown">
<option value="">Select answer</option>
<option value="1" >Yes</option>
<option value="2">No</option>
<option value="3">N.A.</option>
</select>
</td>
</tr>
<td>
<select class="dropdown">
<option value="">开发者_JAVA百科;Select answer</option>
<option value="1" >Yes</option>
<option value="2">No</option>
<option value="3">N.A.</option>
</select>
</td>
</table>
Here is my jquery code.
$('TABLE TR').find('select:gt(1)').prop('disabled',true)
$('TABLE TR').find('select').bind('change',function()
{
$(this).next('select').prop('disabled',false)
});
I want to enable the immediate next drop down value based on the value of first dropdown box. Please someone help..
modify as per your need
$("select.dropdown").change(function(){
if($(this).val()==='2')
{
$(this).nextAll().find("select:first").prop("disabled",true);
}
});
http://jsfiddle.net/4ShsC/1/
Try this fiddle: http://jsfiddle.net/xJVam/
In this example the second dropdown only become enabled when B
selected and the third become enabled when C
selected. However I'm not sure what did you want.
Another approach:
var $selects = $('table tr select');
$selects.each(function(i) {
$(this).prop('disabled', i != 0)
.bind('change', function() {
$selects.eq(i + 1).prop('disabled', false);
});
});
(demo)
Note: A missing <td>
and <tr> ... </tr>
was inserted.
精彩评论