jQuery AJAX post data is null in c# web api controller

Question

I am sending data to a c# web api controller by using the following call.

$.ajax({
    type: "POST",
    url: "menuApi/menu/Cost",
    data: JSON.stringify(order),
    contentType: "application/json",
    success: function (data) { window.alert('done')},
    dataType: 'json'
});

The c# controller on server side is like this:

public string Cost([FromBody] string order)
{
    var sOrder = Newtonsoft.Json.JsonConvert.DeserializeObject<dynamic>(order);

    return "";
}

The order object in Javascript is a complex object with nested arrays and properties. I am getting data as null. I am not sure how can I get the order sent through the ajax call.

Edit: This is my order object

var order = {
    name:"",
    id:"",
    cost:"",
    details: {
        sItem:[{name:"",cost:""}], 
        dItem:[{name:"",cost:"", components:[{name:"",quantity:""}]}]
    }
}

Try using a object as a parameter for your action rather then a string. MVC's mapping functionality should do its thing — Alex
– Alex, Commented Dec 13, 2016 at 6:55
Its not an mvc application. I have just added web api in simple asp.net project — Novice
– Novice, Commented Dec 13, 2016 at 7:07

michalh · Accepted Answer · 2016-12-13 07:41:24Z

2

Got it, you need to post the ajax request as form data with empty parameter/form field name like this:

    var order = {
        name: "",
        id: "",
        cost: "",
        details: {
            sItem: [{ name: "", cost: "" }],
            dItem: [{ name: "", cost: "", components: [{ name: "", quantity: "" }] }]
        }
    };
    $.ajax({
        type: "POST",
        url: "api/Values",
        data: {'': JSON.stringify(order)} ,
        success: function (data) { window.alert('done') },            
    });

answered Dec 13, 2016 at 7:41

michalh

3,03727 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Novice Over a year ago

Its not working for me. The only problem, I am facing is that when actual object, which is a complex nested array object, the data I get is null. Even I tried your example with orderStr = "Hello"; $.ajax({ type: "POST", url: "menuApi/menu/Cost", data: { '': orderStr }, contentType: "application/json; charset=utf-8", success: function (data) { window.alert('done')}, });

Novice Over a year ago

Ok let me try 1:1

Novice Over a year ago

Yes got it, I didn't pay attention to the contentType. Yes it is working now

Novice Over a year ago

this is wonderful. Could not think of trying it with empty parameter. Still dont know the mechanics of why it is working now, but it is working.

Bob Dust · Accepted Answer · 2016-12-13 06:55:17Z

0

The model binder's already done it for you, no need for deserializing. You just need to change parameter type to object or dynamic. Thing left is consideration to remove that redundant processing:

    public string Cost([FromBody] object order)
    {
        var sOrder = Newtonsoft.Json.JsonConvert.DeserializeObject<dynamic>(order.ToString());

        return "";
    }

answered Dec 13, 2016 at 6:55

Bob Dust

2,4601 gold badge20 silver badges14 bronze badges

1 Comment

Novice Over a year ago

There is nothing being done automatic here. It is not MVC project. I have added a web api and calling it from the ajax call.

Collectives™ on Stack Overflow

jQuery AJAX post data is null in c# web api controller

2 Answers 2

4 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related