title: Complex Object passed into ko.mapping.fromJS
body: <p>I have a complex object I want to pass into <code>ko.mapping.fromJS</code> and my problem is that I only want one field to be observable, but the other properties come across as either null or non-existent based on the methods I have tried.</p>
  
  <p>I have created a jsFiddle <a href="http://jsfiddle.net/pcasagrande/J2YTL/" rel="nofollow">here</a> to illustrate my problem. I wish for the inner object to simply be copied as I have no need for it to be observable; I don't want the extra overhead considering the number of these I will have.</p>
  
  <p>The goal of this would be to make the <code>qty</code> editable, but the <code>inner.name</code> remain the same in the text box. This would mean that one is an observable while the other is not.</p>
  
  <p>If any one has another way of doing it that does not involve the mapping I would love to hear it. My view model has quite a few functions and such, and the data is coming in from an AJAX call.</p>
  
  <pre><code>function viewModel() {
      var self = this;
      self.slots = ko.observableArray([]);
  
      self.load = function() {
          ko.mapping.fromJS(
              [
                  { 'qty': 1, 'inner': { 'name': 'thing'} },
                  { 'qty': 2, 'inner': { 'name': 'stuff'} }
              ],
              { 'include': ['qty'], 'ignore': ['inner.name'] },
              self.slots);
      }
  };
  
  ko.applyBindings(new viewModel());
  
  &lt;button data-bind="click: load"&gt;Go&lt;/button&gt;
  &lt;ul data-bind="foreach: slots"&gt;
      &lt;li&gt;
          &lt;span data-bind="text: qty"&gt;&lt;/span&gt;&amp;nbsp;&lt;span data-bind="text: inner.name"&gt;&lt;/span&gt;&lt;input data-bind="value: qty" /&gt;&lt;input data-bind="value: inner.name" /&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>