jquery - MVC Controller Action only receiving nulls from AJAX

Question

I have an ajax call that passes data for two parameters to a controller action. The action is called, but the parameters for the action always have null values (in this case the integer is its default of value of 0). I have made sure to check the packets sent by the ajax call and I do see the correct values I intend to send with the correct parameter/attribute names in stringified JSON.

Here is the Controller Action:

[HttpPost]
public IActionResult Summary(int courseID, String test)
{
    using (LearningCurveContext db = new LearningCurveContext())
    {
        Course course = db.Courses.Where(c => c.CourseId == courseID).FirstOrDefault();
        CourseSummary courseSummary = new CourseSummary
        {
            courseID = course.CourseId,
            courseName = course.Name,
            courseDescription = course.Description
        };

        return PartialView(courseSummary);
    }
}

Here is the Ajax call:

$(document).on("click", ".courseName", function ()
    {
        var element = this;
        $.ajax({
            url: $(element).attr("data-url"),
            type: "POST",
            data: JSON.stringify({ "courseID": "1", "test": "blah" }),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            cache: false,
            success: function (data)
            {
                $("#details-live").html(data);
            },
            error: function ()
            {
                alert("Could not load course summary");
            }
        });
    });

I have tried removing the content type option, as well as not stringifying the data and sending the value of courseID as 1 as well as "1". Nothing seems to work. The URL is correct as the action is being called and the code is run -- just the data doesn't seem to be bound.

Answer 1

Because for Asp.Net core you have to be explicit about where the framework looks for the data. In this case you would need to specify [FromBody], but you would also have to refactor the code to use a model as you can only use that attribute once in the action.

public class CourseSummaryPostModel {
    public int courseID { get; set; }
    public String test { get; set; }
}

Action update

[HttpPost]
public IActionResult Summary([FromBody] CourseSummaryPostModel model) {        
    int courseID = model.courseID;
    String test = model.test;
    using (LearningCurveContext db = new LearningCurveContext()) {
        Course course = db.Courses.Where(c => c.CourseId == courseID).FirstOrDefault();
        CourseSummary courseSummary = new CourseSummary {
            courseID = course.CourseId,
            courseName = course.Name,
            courseDescription = course.Description
        };
        return PartialView(courseSummary);
    }
}

The Ajax remains that same as in the original post with the JSON.stringify

Reference Asp.Net Core: Model Binding