jquery - Knockout select dropdown disable item -

currently i'm able enable/disable entire drop down using enable binding in knockout. when enable = false, whole drop down no longer clickable, , user cannot see other possible values in drop down.

<select data-bind="options: optionslist, optionstext: 'key', optionsvalue: 'value', value: fieldvalue, enable: enable"></select> 

what got rendered this:

<select disabled=""></select> 

what i'm hoping render this

<select>  <option disabled="disabled" value='1'>one </option>  <option selected="select"   value='2'>two </option>  <option disabled="disabled" value='3'>three </option>    </select> 

this way can still see options disabled user can't change them.

i have looked @ optionsafterrender in knockout, no longer have access selected value. item passed in key , value of select item, not observable.

any appreciated.

you choose build option elements using foreach like:

<select data-bind="value: selected, foreach: options">     <option data-bind="attr: { disabled: !enabled(), value: value }, text: name"></option> </select> 

sample: http://jsfiddle.net/rniemeyer/4puxq/

otherwise, here sample of optionsbind binding michael best let bind option without using foreach (uses optionsafterrender functionality):

<select data-bind="value: selected, options: options, optionstext: 'name', optionsvalue: 'value', optionsbind: 'attr: { disabled: !enabled() }`"></select>' 

sample: http://jsfiddle.net/rniemeyer/kxy44/