title: Select the first drop down the related drop down must be displayed
body: <pre><code>    var ViewModel = function () {
      var self = this;
      self.categories = ko.observableArray([
      {
      "name": "10th", "subcategories": [
      { "name": "SSC" },
      { "name": "CBSE" }
      ]
      },
      {
      "name": "12th", "subcategories": [{
      "name": "MPC"
      }, { "name": "BPC" }]
      }
      ]);
      self.selected_category = ko.observable();
      self.selected_sub_category = ko.observable();
      }
      ko.applyBindings(new ViewModel());
  </code></pre>
  
  <p>I'm selecting first dropdown which has 2 values like SSC and 12th so second dropdown must be displayed based on the first dropdown in the first row.When I click add button first dropdown is binding correctly, but the second dropdown is having the values as selected in the first row. I need the second dropdown to bind the values depending on the other selection like second row I have selected 12th so second drop down should have "MPC" and "BPC" as its values not "SSC" and "CBSE"</p>