Knockout Nested Association Mapping

HTML

<script src="http://jquery-json.googlecode.com/files/jquery.json-2.3.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/knockout/2.2.1/knockout-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.3.5/knockout.mapping.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
  <div data-bind="foreach: conversation">
      <input type="text" data-bind="value: count_messages"/>
    <div data-bind="foreach: messages">
       <div class="well"> 
          <div data-bind="text: sender_name"></div> 
          <div data-bind="text: subject"></div>
          <div data-bind="text: body"></div>
          <div data-bind="text: updated_at"></div> 
        </div>    
    </div>
  </div>

JavaScript

// Sample JSON to return for initialization; 2 second delay


var conversationData = {
    json: $.toJSON(
            {"id":8,"subject":"Hello! Email two!",
             "updated_at":"Sep 27",
             "originator":"James Pablo",
             "count_messages":"(2)",
             "messages":[{"subject":"RE: Hello! Email two!",
                          "body":"Thanks for the message!",
                          "sender_name":"Mr Big","updated_at":"Sep 27"},
                         {"subject":"Hello! Email two!",
                          "body":"Body text",
                          "sender_name":"James Pablo",
                          "updated_at":"Sep 27"}
                        ]
            }
    ),
    delay: 1
}



function Conversation(data) {
    ko.mapping.fromJS(data, map, this);
}

function Message(data) {
    ko.mapping.fromJS(data, {}, this);
}

var map = {
    messages: function(options) {
      return new Message(options.data);
    }
}


var ViewModel = function() {
    var self = this;
    self.conversation = ko.observable();
    
    self.goToConversation = function(conversation) {
        
      // Use JSFiddle echo to simulate an AJAX service
      (function() {
        $.ajax({ url:"/echo/json/", data:conversationData, type:"POST",
                 success:function(data)
                 {
                   // Map the returned JSON to the View Model  
                   self.conversation(new Conversation(data));
                 }
               });
       })();  
       // End User JSFiddle echo  
    };
     
    self.goToConversation();
};

ko.applyBindings(new ViewModel());