Mukund Bhut Mukund Bhut - 6 months ago 59
jQuery Question

How to disable all option second select box that can be less than to first select box selected option?

I have requirement to get date between particular years so I have put two dropdown “from year” and “to Year” but I want to make validation for that “to dropdown” value must be great than “form dropdown”

Below is my html code

<div class="graph-filter">

<label>From</label>
<select onchange="change_data_year();" id="from_data_year" name="from_data_year" class="graph-select">
<option selected="" value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
</select>

<label>To</label>
<select id="to_data_year" name="to_data_year" class="graph-select">
<option selected="" value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
</select>

<input type="submit" value="Submit">



Answer

Try like this

 function change_data_year(){

    $('#to_data_year option').prop('disabled',false);
    var from_data_year=$('#from_data_year').val();
    var to_data_year=$('#to_data_year').val();

    $('#to_data_year option').filter(function() {
        return $(this).val() < from_data_year;
     }).prop('disabled', true);

 } 

I hope that is like you need it.