Passing object from jquery ajax to WebAPI results to null

Question

On the HTML:

<div>
    <button onclick="clicker()">Click Me!</button>
</div>

<script type="text/javascript">
    function clicker() {
        var data = {
          id: 1,
          name: 'julius'
        };

        $.ajax({
            type: 'POST',
            url: '/api/test/',
            data: JSON.stringify(data),
            contentType: "application/json; charset=utf-8"
        });
    }
</script>

On the Controller:

public class TestController : ApiController
{
    public void Post([FromBody]string value)
    {
      Console.WriteLine();
    }
}

The value of the variable "value" on the controller is null, although, I pass data to ajax call. Can somebody please explain why this happens?

Jon Susiak · Accepted Answer · 2014-10-24 09:57:11Z

2

Instead of trying to receive the posted content as a string, create an object that encapsulates the properties you are posting:

public class Data
{
    public int id { get; set; }
    public string name { get; set; }
}

and then change your controller to:

public class TestController : ApiController
{
    public void Post(Data value)
    {
      int id = value.id;
      string name = value.name;
    }
}

If you really want to receive the posted data as a string this blog post by Darrel Miller might help:

Posting raw JSON to Web API.

answered Oct 24, 2014 at 9:57

Jon Susiak

4,9781 gold badge34 silver badges39 bronze badges

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

1 Comment

jysummers Over a year ago

Thanks Jon for sharing idea and the blog post! =)

Collectives™ on Stack Overflow

Passing object from jquery ajax to WebAPI results to null

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related