title: "400 Bad Request" response for AJAX request
body: <p>I have the following jQuery AJAX request:    </p>
  
  <pre><code>// collect form data and create user obj
  var user = new User();
  user.firstname =  $("#usrFirstName").val();
  user.lastname =  $("#usrSurname").val();
  user.role =  $("#usrRole").val();
  
  // actual ajax request
  $.ajax({
      type: 'POST',
      url : 'http://awesome-url',
      crossDomain: true,
      data: user,
      contentType:"application/json; charset=utf-8",
      dataType: 'json'
  }).done(function(data, status) {
      alert(JSON.stringify(data));
  }).fail(function(data, status) {
      alert(status);
      alert(JSON.stringify(data));
  });
  </code></pre>
  
  <p>The response from the Server is:</p>
  
  <blockquote>
    <p>"status":400,"statusText":"Bad Request"<br>
    "The request sent by the client was syntactically incorrect."</p>
  </blockquote>
  
  <p>The server is running Spring-MVC. But as far as I can tell it is working correctly. Because if I'm sending a request manually with Postman and the following configuration it works.</p>
  
  <p>Header:</p>
  
  <pre><code>Content-Type application/json; charset=utf-8
  </code></pre>
  
  <p>Content:</p>
  
  <pre><code>{"firstname":"alex","lastname":"lala","role":"admin"}
  </code></pre>
  
  <p>I have to mention that it is a cross-domain request (for the time developing, it will be hosted on the same domain as the server later). I did disable the security settings in the browser and AJAX requests to the server are working fine (as long as I don't have to send data).</p>