0

I'm trying to test my asp api.

One of the endpoints needs to take a json object from a browser. To test this I'm placing a json object into a text field and then making an ajax call to my api. When the api is hit, the json object is always null.

I've checked this post: how to pass json post data to web api method as object and that did not resolve my issue.

Here is my object:

{   "userName": "063bcdf2-36fd-4b8c-a5af-808da63744f6",
     "password" : "Password"
}

Here is my ajax call:

        var submission = function () {
        var url = urlBase + "/api/Submission/";
        var testdata = $("input[name=submission]").val();
        alert(testdata);
        $.ajax(url, {
                type: "POST",
                data: JSON.parse(testdata),
                contentType: 'application/x-www-form-urlencoded'
        }).always(showResponse)
          return false;
        };

And here is my api:

    [HttpPost]
    [ResponseType(typeof(SubmissionOutputModel))]
    public IHttpActionResult POST([FromBody]SubmissionInputModel submission )
    {
        if (ModelState.IsValid)
        {
            SubmissionService service = new SubmissionService();
            return Json(service.Submit(submission));
        }
        else
        {
            return BadRequest("Invalid Model State");
        }

    }

SubmissionInputModel:

    public class SubmissionInputModel
{
    [Required]
    public string userName { get; set; }
    [Required]
    public string  password { get; set; }

}

The alert in the ajax shows me that the data is being sent and in debug mode, the api is getting hit however the submission object is not getting set to the data being sent from the ajax call.

If anyone can help, it would be greatly appreciated!

Community
  • 1
  • 1
user2900166
  • 499
  • 1
  • 5
  • 11

3 Answers3

0

I think you need to JSON.stringify instead of parse, since parse if used the other way around. JSON.parse takes a string and converts it to a JSON object.

Try to stringify your testdata

   $.ajax(url, {
                type: "POST",
                data: JSON.Stringify(testdata),
                contentType: 'application/x-www-form-urlencoded'
        }).always(showResponse)
          return false;
        };

If that doesn't work, leave out the contentType from the ajax call, or write contentType:"application/json" instead.

And also post your SubmissionInputModel. Could be some naming that is wrong there :)

Semir Cato
  • 29
  • 2
0

What does the "testdata" look like? Is it already a string in json format?

1.The JSON.Parse parses a string as JSON only, for example:

JSON.parse('{}');              // {}
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]

2.The content-type should application/json in your case, and the value you specified now is default value:

contentType: 'application/json'

3.At the mean time, as your action already marked as [POST] so the ModelBinder will try to bind your model from the request body, so it is not necessary to specify as [FromBody].

Panda Zhang
  • 483
  • 3
  • 8
  • Yes, the data is already json. I've tried both application/json and application/x-www-form-urlencoded with no luck. I've also tried it without specifying the content-type at all. – user2900166 Sep 26 '14 at 23:58
0

Okay, I found my happy place!

The following ajax call finally got the data through to the API:

        var submission = function () {
        var url = urlBase + "/api/Submission/";
        var testdata = $("input[name=submission]").val();
        alert(testdata);
        $.ajax(url, {
            type: "POST",
            data: testdata,
            contentType: 'application/json'
        }).always(showResponse)
        return false;
        };

Notice that there is no JSON method on the data in the call and the contentType is 'application/json'.

Thank you everyone for your help. I hope this helps the next poor soul that runs into this problem!

user2900166
  • 499
  • 1
  • 5
  • 11