Grijan
Grijan

Reputation: 298

How to disable a specific option in select tag using chosen jquery

I have a select which is rendered by chosen multiselect jquery.

`<select>
    <option>red</option>
    <option>blue</option>
    <option>yellow</option>
    <option>green</option>
    <option>white</option>
</select>`

my question here is, when i select red i want to disable all the other options in my multi select, how to do it?

Thanks

Upvotes: 0

Views: 253

Answers (1)

Majed Badawi
Majed Badawi

Reputation: 28434

You can detect the change in the value, and iterate on all other options in case red is selected to disable them using .attr("disabled","disabled"); as follows:

$(document).ready(function(){
     $('select').on('change', function(){
          if(this.value == 'red'){
               $('select option').map(function() {
                    if($(this).val()!='red')
                         $(this).attr("disabled","disabled");
               });
          }
     })
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
     <option>red</option>
     <option>blue</option>
     <option>yellow</option>
     <option>green</option>
     <option>whi te</option>
</select>

Upvotes: 1

Related Questions