title: KnockoutJs mapping to view model complex property
body: <p>I am new to knockout and trying what I thought would be a simple scenario, but its just not working. Neither of the two input's changes when the selection changes, and the select list does not initialise to the selectedFormat.</p>
  
  <p>HTML: </p>
  
  <pre><code>&lt;input type="text" data-bind="value: selectedFormat.id" /&gt;
  &lt;input type="text" data-bind="enable: selectedFormat.fields()[0].enabled" /&gt;
  
  &lt;select data-bind="options: formats, optionsText: 'name', value: selectedFormat" /&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var data = {
      formats: [
          { id: 1, name: 'Format 1', fields: [
              { id: 1, enabled: true }, 
              ]}, 
          { id: 2, name: 'Format 2', fields: [
              { id: 1, enabled: false }, 
              ]}
          ], 
      selectedFormat: 
          { id: 2, name: 'Format 2', fields: [
              { id: 1, enabled: false }, 
              ]}
      }
  
  var vm = ko.mapping.fromJS(data);
  
  ko.applyBindings(vm);
  </code></pre>
  
  <p><a href="http://jsfiddle.net/paulbau/ZnqNN/1/" rel="nofollow">http://jsfiddle.net/paulbau/ZnqNN/1/</a></p>