AJAX & Web Api Post Method - How does it work?

Question

I am trying to write to my database using AJAX / Jquery and c#. Whenever I pass the parameter in to the C# code it shows as null. I am using the default template that visual

Answer 1

I found the problem with help from Microsoft Docs Use JS code as mentioned

$.post('api/updates/simple', { "": $('#status1').val() });

What I missed was adding empty property name, so what OP needs to do is{"":data:JSON.stringify(dataJSON)}, instead of data:JSON.stringify(dataJSON),

Answer 2

For simple type, on server side:

public void Post([FromBody]string name)
{
}

on the client side, you just define if you want to send in json format:

    var dataJSON = "test";

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '/api/NewRecipe',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

If you want to make it work in complex type, from server side you should define:

public class RecipeInformation
{
    public string name { get; set; }
}

public class ValuesController : ApiController
{
    public void Post(RecipeInformation information)
    {
    }
}

And from client side:

    var dataJSON = { name: "test" };

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '/api/NewRecipe',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

Answer 3

You can try doing something like this and use the jquery param method

    var postData = {
        name : 'name'
    }

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '../api/NewRecipe',
            data: $.param(postData,true),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

Answer 4

Binding in API controllers is a little on the strange side. I believe:

public void Post([FromBody]RecipeInformation information)

with

var dataJSON = { name: "test" };

should work, and will definitely work if you just pass it as form data.

Answer 5

There's a piece you're missing is the data contract attributes If you make a your class like:

[DataContract]
public class RecipeInformation
{
    [DataMember]
    public string name { get; set; }
}

These attributes are found in System.Runtime.Serialization, and the Json parser (Json.NET) uses them to (help) deserialize the model.

Answer 6

I suppose that you are using ASP.NET WebAPI and it bind all simple types (int, bool, string, etc) from URL and all complex types from body. When you marked name with FromBody attribute then it bind it from request body instead of url mapping.

You can read more about ASP.NET WebAPI routing and parameter binding here:

• On www.asp.net
• On www.west-wind.com
• and on MSDN