AJAX Post never makes it to ASP.Net Controller

Question

I know this call works, because I can see it in the xhr headers when debugging. However, the data never seems to hit the controller and I can't figure out why. My ASP.Net skills are pretty limited so I'll post everything I've done.

JS:

var data = JSON.stringify(myObj)
$.ajax({
    url: '/Things/UploadInfo',
    type: 'POST',
    data: data,
    dataType: 'json',
    contentType: 'application/json; charset=utf-8',
    crossDomain: true,
    cache: false,
    processData: false,
    success: function (data) {
      console.log('success')
    },
    error: function() {
      console.log('error')
    }
});

ThingsController.cs

string data keeps returning null

[System.Web.Http.HttpPost]
public JsonResult UploadInfo(string data)
{
    InfoModel someInfo = new InfoModel();

    return Json(new { status = "success" });
}

InfoModel.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace ProjectName.Models
{
    public class InfoModel
    {
        public class Attr
        {
            public string name { get; set; }
            public string age { get; set; }
            public string sex { get; set; }
        }
    }
}

"Content" is (when using the default template) a folder where your images, CSS, etc. lives. Did you rename that folder? If not, it normally won't get mapped by the routing engine. — Tieson T.
– Tieson T., Commented Mar 3, 2017 at 22:24
Where does that ajax call live? Are you using a script tag within a view? — Tieson T.
– Tieson T., Commented Mar 3, 2017 at 22:58
It's within a Vue.js build. The built files are within a view. — itsclarke
– itsclarke, Commented Mar 3, 2017 at 23:01

Tieson T. · Accepted Answer · 2017-03-03 23:21:39Z

I would start by simplifying your ajax call. The setup you're using is required for WebForms, but the MVC and WebApi frameworks don't require those extra options (with the exception of crossDomain, but it doesn't look like you're actually doing anything CORS-related).

Here's what I would use:

$.post('/Things/UploadInfo', myObj)
    .done(function (response, status, jqxhr) {
      console.log('success')
    })
    .fail(function(jqxhr, status, error) {
        console.log('error')
    });

This assumes that myObj is either a JSON object or can be implicitly serialized.

Your UploadInfo action should probably have either a model to bind, or the individual parameters you're expecting. Let's say you had this model:

public class Foo
{
    public int ID { get; set; }
    public string Name { get; set; }
}

Then your action would look like

public ActionResult UploadInfo(Foo model)

or

public ActionResult UploadInfo(int id, string name)

and both would be mapped by the model binder. As a side note, you can leave the return type (mostly) generic - JsonResult inherits ActionResult, so you can still use return Json() when the return type is ActionResult.

If you're expecting varying JSON objects, then the data object you supply to the ajax call would be something like:

var data = {
    data: myObj
};

TrevorBrooks · Accepted Answer · 2017-03-03 22:39:26Z

0

A few things:

For your ajax url, use "http://localhost:portNumber/Things/UploadInfo"
Change your UploadInfo parameter to (InfoModel data).
Use a utility like Chrome extension Advanced Rest Client and make sure you can hit a breakpoint in your method. https://chrome.google.com/webstore/detail/advanced-rest-client/hgmloofddffdnphfgcellkdfbfbjeloo?hl=en-US

answered Mar 3, 2017 at 22:39

TrevorBrooks

3,9504 gold badges34 silver badges55 bronze badges

2 Comments

itsclarke Over a year ago

Thanks for the info. I changed my ajax url and the parameter info, but I'm getting the same results. ARC is giving a 200 OK status as well.

TrevorBrooks Over a year ago

Can you set a breakpoint in your method when testing with ARC? When/if it broke into your method, was the parameter data null? Empty?

Collectives™ on Stack Overflow

AJAX Post never makes it to ASP.Net Controller

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related