jQuery - disable selected options

Question

Need to disable already selected options in select box using jQuery  I d like it to grey out like asmselect   Test my example here     JS     theSelect   change function                var value       theSelect option selected   val      var theDiv       is    value      theDiv slideDown   removeClass  hidden             div a remove   click function               this  parent   slideUp function       this  addClass  hidden                HTML  lt body gt   lt div class  selectContainer  gt       lt select id  theSelect  gt           lt option value    gt - Select - lt  option gt           lt option value  Patient  gt Patient lt  option gt           lt option value  Physician  gt Physician lt  option gt           lt option value  Nurse  gt Nurse lt  option gt       lt  select gt   lt  div gt   lt div class  hidden isPatient  gt Patient  lt a href     class  remove  rel  Patient  gt remove lt  a gt  lt  div gt   lt div class  hidden isPhysician  gt Physician  lt a href     class  remove  rel  Patient  gt remove lt  a gt  lt  div gt   lt div class  hidden isNurse  gt Nurse  lt a href     class  remove  rel  Patient  gt remove lt  a gt  lt  div gt   lt  body gt     UPDATED  Here s the finished solution  Thanks to Patrick and Simen

User · Accepted Answer

Add this line to your change event handler          theSelect option selected   attr  disabled   disabled            siblings   removeAttr  disabled      This will disable the selected option  and enable any previously disabled options   EDIT   If you did not want to re-enable the previous ones  just remove this part of the line            siblings   removeAttr  disabled        EDIT   http   jsfiddle net pd5Nk 1   To re-enable when you click remove  add this to your click handler       theSelect option value     value        removeAttr  disabled

User · Answer

pls try this       select id option value    value       attr  disabled   true

User · Answer

This will disable enable the options when you select remove them  respectively       theSelect   change function                  var value     this  val        if  value         return      var theDiv       is    value        var option      option value      value         this       option attr  disabled   disabled         theDiv slideDown   removeClass  hidden        theDiv find  a   data  option  option            div a remove   click function                 this  parent   slideUp function       this  addClass  hidden              this  data  option   removeAttr  disabled          Demo  http   jsfiddle net AaXkd

User · Answer

This seems to work       theSelect   change function                  var value       theSelect option selected   val        var theDiv       is    value        theDiv slideDown   removeClass  hidden          Add this            theSelect option selected   attr  disabled    disabled             div a remove   click function                 this  parent   slideUp function       this  addClass  hidden                 and this          theSelect option disabled   removeAttr  disabled

[jquery] jQuery - disable selected options

Examples related to jquery

Examples related to html-select