Question

AJAX Call

$.ajax({
    url: '/api/Inventory',
    cache: false,
    type: 'POST',
    data: json,
    contentType: 'application/json, charset=utf-8',
    statusCode: {
        201: function (data) {
            console.log(data);
            viewModel.items.push(data);
        }
    }
});

Sent Data (json) / Request Payload

{"Id":0,"Upc":"3456789012","Quantity":"200","Category":"Vodka","TransactionType":"Audit","MetaData":"ABSOLUT 750ml"} 

Response Error

No MediaTypeFormatter is available to read an object of type
‘InventoryItem’ from content with media type ”undefined”.”

Routed POST method

public HttpResponseMessage PostItem(InventoryItem item)

All properties in the JSON string are present in the InventoryItem model.

A similar question regarding complex types suggested upgrading from Beta to RC to fix a model binding change, which I have done.

If the question isn’t obvious, how do I rectify this error? If I add the the [FromUri] attribute to the Routed POST method, then the AJAX call is routed properly, but with an empty InventoryItem. If you need any other information, please let me know.

Answer 1

contentType: 'application/json, charset=utf-8',

should be:

contentType: 'application/json; charset=utf-8',

Notice the usage of ; instead of , which is the correct separator between the content type and the charset. Also if you follow standard RESTful conventions your controller action should be called Post and not PostItem as you have shown:

public HttpResponseMessage Post(InventoryItem item)
{
    ...
}