title: How can I disable/enable a drop down embedded in a table mapped to a knockout observable array
body: <p>I'd like to disable/enable a drop down embedded in a table in a form until a particular value is selected in the predecessor drop down.</p>
  
  <p>Here's what I tried that doesn't seem to work:</p>
  
  <pre><code>&lt;tbody data-bind="foreach:studentData"&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;span data-bind="text:rollNo"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;td&gt;&lt;select class="form-control" data-bind="options:$parent.sexDropDown,optionsText:'name',optionValue:'id',value:sex,optionsCaption:'-Select-'"&gt;&lt;/select&gt;&lt;/td&gt;
          &lt;td&gt;&lt;select class="form-control" data-bind="options:$parent.uniformTypeDropDown,optionsText:'name',optionValue:'id',value:uniform,enable:sex? (sex.id == 2):false,optionsCaption:'-Select-'"&gt;&lt;/select&gt;&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>Please find the associated fiddle <a href="https://jsfiddle.net/2w6bq3pk/" rel="nofollow noreferrer">here</a></p>
  
  <p>To give a brief I want the "Uniform Type" drop down in each of the rows to be enabled in case the option "Female" is selected in the "Sex" drop down and it needs to be disabled in all other scenarios.</p>