title: knockout.mapping as JSON back to Api controller not converting back to object
body: <p>I am trying to get the knockout.js library and knockout.mapping.js library to work in my MVC4 application. I am using a controller to generate the view.  The razor view is converting the model to a JSON string and then I am using the mapping plugin to get my JSON model in my MV.
  That part all works fine.  If I add some values to the model in the controller they are showing up in my view.  The problem I am having is sending back to me WebApi controller.  Once I get it there It will not convert back into my serializable model. Here is what I have:</p>
  
  <pre><code>&lt;script type="text/javascript" src="/Scripts/knockout-2.1.0.debug.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/Scripts/knockout.mapping-latest.debug.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  function SearchModel() {
      var self = this;
      var baseUri = '/Api/searchsubscriber/FindSubscriber';
  
      self.search = function (formElement) {
          debugger;
          var myJSONString = JSON.stringify(ko.mapping.toJS(formElement));
          alert(myJSONString);
          $.ajax({
              type: "POST",
              url: baseUri,
              data: myJSONString
          }).done(updateSearchResults);
  
      };
  
      updateSearchResults = function (data) {
          debugger;
          var jsonString = JSON.stringify(data);
          alert(jsonString);
      };
  };
  $(function () {
      debugger;
  //in my actualy view it looks like this
  //var jsonModel = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model))';
      var jsonModel = '{"SubscriberNum":null,"PersonCode":null,"ClientCode":null,"LastName":"TEST","FirstName":"H","MI":null,"DOB":null,"StartDt":null,"EndDt":null,"GroupNum":null}';
      var mvcModel = ko.mapping.fromJSON(jsonModel);
  
      var myViewModel = new SearchModel();
      var g = ko.mapping.fromJS(myViewModel, mvcModel);
  
      ko.applyBindings(g);
  });
  &lt;/script&gt;&lt;code&gt;
  </code></pre>
  
  <p>This is my model</p>
  
  <pre><code>[Serializable]
  public class SearchSubscriberFields //: SearchSubscriberResults
  {
     //public List&lt;SearchSubscriberResults&gt; Results { get; set; }
     public string SubscriberNum { get; set; }
     public string PersonCode { get; set; }
     public string ClientCode { get; set; }
     public string LastName { get; set; }
     public string FirstName { get; set; }
     public string MI { get; set; }
     public string DOB { get; set; }
     public string StartDt { get; set; }
     public string EndDt { get; set; }
     public string GroupNum { get; set; }
  }
  </code></pre>
  
  <p>This is my ApiController</p>
  
  <pre><code>[Authorize]
  public class SearchSubscriberController : ApiController
  {
      MyService _service = new MyService();
  
      [HttpPost]
      public SearchSubscriberFields FindSubscriber(SearchSubscriberFields search)
      {
          if (search != null)
          {
              SearchSubscribersRequest request = new SearchSubscribersRequest();
  
              request.Credentials = new Credentials() { Username = User.Identity.Name };
  
              request.SubscriberNum = Utility.FormatString(search.SubscriberNum).ToUpper();
              request.PersonCode = Utility.FormatString(search.PersonCode).ToUpper();
              request.ClientCode = Utility.FormatString(search.ClientCode).ToUpper();
              request.LastName = Utility.FormatString(search.LastName).ToUpper();
              request.FirstName = Utility.FormatString(search.FirstName).ToUpper();
              request.MI = Utility.FormatString(search.MI).ToUpper();
  
              SearchSubscribersResponse response = _service.SearchSubscribers(request);
  
              if (response.Errors.Count &lt; 1)
              {
                  return search;
              }
         }
          return search;
      }
  }
  </code></pre>
  
  <p>So, from every example that I have looked at this should work.  If I change the object in the api controller to <code>FindSubscriber(JObject search)</code> I can see that I am getting a JSON string. Fiddler show it is sending a JSON string.
  From Fiddler:</p>
  
  <pre><code>POST http://localhost:60248/Api/searchsubscriber/FindSubscriber HTTP/1.1
  Accept: */*
  Content-Type: application/x-www-form-urlencoded
  X-Requested-With: XMLHttpRequest
  Referer: http://localhost:60248/Subscriber/Search
  Accept-Language: en-US,es-DO;q=0.5
  Accept-Encoding: gzip, deflate
  User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
  Host: localhost:60248
  Content-Length: 157
  Connection: Keep-Alive
  Pragma: no-cache
  {"SubscriberNum":null,"PersonCode":null,"ClientCode":null,"LastName":"TEST","FirstName":"H","MI":null,"DOB":null,"StartDt":null,"EndDt":null,"GroupNum":null}
  </code></pre>
  
  <p>I just am not getting a result in my controller that I can get back into a <code>SearchSubscriberFields</code> object.</p>
  
  <p>Any ideas are greatly appreciated.</p>