title: JSON not deserialized to object when doing AJAX post to MVC action
body: <p>I would like to start of by saying I have tried most of SO answers on this matter and they do not address this issue.</p>
  
  <p>I have a problem when posting to my controller action via jQuery ajax request.</p>
  
  <p>This is my JSON object:</p>
  
  <pre><code>var service = {
          ServiceID: $('#ServiceID').val(),
          ServiceName: $('#ServiceName').val(),
          ServiceActive: $('#ServiceActive').val(),
          ServiceDescriptionShort: $('#ServiceDescriptionShort').val(),
          ServiceDescription: $('#ServiceDescription').val()            
      };
  </code></pre>
  
  <p>This is my class:</p>
  
  <pre><code>public class ServiceJson
  {
      public int ServiceID
      {
          get;
          set;
      }
  
      public string ServiceName
      {
          get;
          set;
      }
  
      public bool ServiceActive
      {
          get;
          set;
      }
  
      public string ServiceDescriptionShort
      {
          get;
          set;
      }
  
      public string ServiceDescription
      {
          get;
          set;
      }
  }
  </code></pre>
  
  <p>This is my action(it does nothing for now but that's not the point):</p>
  
  <pre><code>[HttpPost]
  [Route("edit")]
  [ValidateJsonAntiForgeryToken]
  public JsonResult Edit(ServiceJson service)
  {
      return Json("", JsonRequestBehavior.AllowGet);
  }
  </code></pre>
  
  <p>Finally, this is my ajax request:</p>
  
  <pre><code>$.ajax(
  {
      type: 'POST',
      url: '@Url.ActionWithoutData("edit", "service")',
      data: JSON.stringify(service),
      headers: {
          "__RequestVerificationToken": $('input[name="__RequestVerificationToken"]').val()
      },
      contentType: 'application/json; charset=utf-8',
      dataType: 'json',
      processData: false,
      contentType: false,
      success: function (responseData) {
          $('#ServiceID').val(responseData.ServiceID);
          $.snackbar({ content: 'Successfully saved.' });
      },
      error: function (xhr, ajaxOptions, thrownError) {
          $('#errorMessage').html(xhr.responseJSON.Message);
          $('#error').modal('toggle');
      }
  });
  </code></pre>
  
  <p>My problem is that this JSON object is not serialized into my class. Clearly the names correspond. I am sure I'm missing something trivial as I have tried with simple parameters like passing just name(and of course changing the action parameter to correspond to it) without luck. I can see in the Request object that I am recieving my data but it is not being deserialized to my object.</p>
  
  <p>In browser I can also see that the object is being passed correctly.</p>
  
  <p><a href="https://i.stack.imgur.com/bxOZl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/bxOZl.png" alt="enter image description here"></a></p>
  
  <p>Help!</p>