how to post json object array to a web api

Question

How can I post a JSON array to a Web API? It's working for single object.

This is what I've tried, but the controller seems to be returning 0 rather than the expected 3.

This is my JSON:

var sc = [{
 "ID": "5",
 "Patient_ID": "271655b8-c64d-4061-86fc-0d990935316a",
 "Table_ID": "Allergy_Trns",
 "Checksum": "-475090533",
 "LastModified": "2015-01-22T20:08:52.013"
 },
 {
 "ID": "5",
 "Patient_ID": "271655b8-c64d-4061-86fc-0d990935316a",
 "Table_ID": "Allergy_Trns",
 "Checksum": "-475090533",
 "LastModified": "2015-01-22T20:08:52.013"
 },
 {
 "ID": "5",
 "Patient_ID": "271655b8-c64d-4061-86fc-0d990935316a",
 "Table_ID": "Allergy_Trns",
 "Checksum": "-475090533",
 "LastModified": "2015-01-22T20:08:52.013"
 }]; 

AJAX call:

$.ajax({
 url: urlString,
 type: 'POST',
 data: sc,
 dataType: 'json',
 crossDomain: true,
 cache: false,
 success: function (data) { console.log(data); }
 });

Web API controller:

[HttpPost]
public string PostProducts([FromBody]List<SyncingControl> persons)
{
 return persons.Count.ToString(); // 0, expected 3
}

• Matthew Haugen: I don't imagine this is it, but have you tried using dev tools in the browser to just confirm that the payload is even being sent? I know nothing about Web API so perhaps this isn't the most likely cause, but I can imagine something client-side setting sc equal to null before the request gets fired off, which seems like it could do this.
• Joel Gregory: Any errors in the browser console? You are missing a double quote in the first person object in sc.
• Ranvijay Singh: no any error on console

Answer 1

There is an error in the json Table_ID": "Allergy_Trns" should be "Table_ID": "Allergy_Trns".

Missing double quote.

Update

You need to make sure that you are sending your parameters as json as follows:

 $.ajax({
 url: urlString,
 type: 'POST',
 data: JSON.stringify(sc),
 dataType: 'json',
 contentType: 'application/json',
 crossDomain: true,
 cache: false,
 success: function (data) { console.log(data); }
 });

Notice the JSON.stringify(sc), @herbi is partly correct too about specifying a content type.

Screen grab

**Screen grab**

• Ranvijay Singh: hutchonoid: its missed here not in my code sorry for that.

Answer 2

You have to add the content-type header to the ajax request, so that WebAPI is able to understand the request and use the correct formatter to deserialize the data:

$.ajax({
 url: urlString,
 type: 'POST',
 data: sc,
 dataType: 'json',
 contentType: "application/json",
 crossDomain: true,
 cache: false,
 success: function (data) { console.log(data); }
 });

• Herbi: sorry, it is "contentType", not "content-Type"

Answer 3

You can set the Content-Type on beforeSend which will insure that your json data matches with your server object

$.ajax({
 beforeSend: function (xhr) {
 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 },
 url: urlString,
 type: 'POST',
 data: sc,
 dataType: 'json',
 contentType: "application/json",
 crossDomain: true,
 cache: false,
 success: function (data) { console.log(data); }
 });