How to properly bind JSON data from POST request to object parameter in Web API?

Other Questions API
1

I’m working with an ASP.NET MVC4 Web API and running into issues with data binding. When I send JSON data through a POST request, the object parameter in my controller method ends up with null values for all properties.

I have a controller that should receive user data, but the binding isn’t working correctly. The JSON gets sent but doesn’t map to my model properties.

I’m using application/x-www-form-urlencoded as the content type because that’s what my current JavaScript setup uses, and I’m not sure how to modify it easily.

Here’s my setup:

public class UsersController : ApiController {
    
    public object Post([FromBody] User userData)
    {
        return Request.CreateResponse(HttpStatusCode.OK,
        new
        {
            user = userData
        });
    }
}

public class User
{
    public string business_name { get; set; }
    public string person_name { get; set; }
}

The request looks like this:

POST http://localhost:8080/api/users HTTP/1.1
Accept: application/json, text/javascript, */*; q=0.01
X-Requested-With: XMLHttpRequest
Content-Type: application/x-www-form-urlencoded; charset=UTF-8

{"person_name":"john","business_name":"acme"}

What’s the right way to make this work?

2

The main issue here is the mismatch between your content type and the actual data format you’re sending. You’re declaring application/x-www-form-urlencoded but actually sending JSON in the request body, which confuses the Web API model binder. I ran into this exact problem about two years ago when migrating legacy JavaScript code. The easiest fix without changing your frontend is to modify how you send the data. Instead of sending raw JSON with form-urlencoded content type, you need to actually URL-encode it. Your request body should look like this: {\"person_name\":\"john\",\"business_name\":\"acme\"}. However, the cleaner solution is changing your JavaScript to use application/json content type and send proper JSON. This works better with Web API’s default model binding. I found that most modern browsers handle JSON content type without issues, and it eliminates these binding problems entirely. The [FromBody] attribute will then correctly deserialize your JSON to the User object.

3

had same problem last month. your content-type header is telling webapi to expect form data but youre sending json. either change javascript to use application/json or format your data as actual form params like person_name=john&business_name=acme. the [FromBody] works fine once content type matches the actual data format

4

This binding issue stems from Web API’s expectation that form-urlencoded data should be key-value pairs, not JSON strings. I encountered similar frustration when working with legacy AJAX calls that couldn’t easily switch content types. One approach that worked for me was creating a custom model binder to handle JSON within form-encoded requests, but honestly that’s overkill for most scenarios. The simplest fix without touching your frontend code is to send the data as proper form parameters: person_name=john&business_name=acme instead of the JSON object. Alternatively, you can modify your controller to accept a single string parameter and manually deserialize it using JsonConvert. However, I’d strongly recommend updating your JavaScript to use application/json content-type when possible, as it aligns better with Web API conventions and prevents these headaches in future development.