AJAX POST Request Not Passing Data to Controller Method in ASP.NET Core 2.2

Question

Before I begin, I'd like to say - I realize that this question is very similar to many others that have been posted and answered on this site. I have read through and tried as many solutions as I could find that was related to my issue, and none have worked thus far.

I'm attempting to pass data from my web page to a controller method. The web page is very simple and only needs to capture information input by the user and send it off. I'm using Telerik's Kendo Grid to bind to and organize my data. No matter what I try, though, my AJAX post request never passes parameters forward correctly. When using my browser's debugger, I can see that the parameters being passed into the AJAX request are valid, but by the time they hit my breakpoint in the controller method, they are all either null or default.

Function Containing AJAX Request

function saveShiftDataToServer() {
    var grid = $("#myGrid").data("kendoGrid");
    var dataSource = grid.dataSource;
    var allData = dataSource.data();
    var comments = '@Model.Comments';
    var loadInfoCorrect = '@Model.LoadInfoCorrect';

    $.ajax({
        type: "POST",
        url: '/Home/SaveData',
        data: JSON.stringify({ accessorials: allData, comments: comments, loadInfoCorrect: loadInfoCorrect }),
        contentType: "application/json; charset=utf-8",
        datatype: "json"
    })
}

Controller Method

[AcceptVerbs("Post")]
public ActionResult SaveData(Accessorial[] accessorials, string comments, bool loadInfoCorrect)
{
    // Code removed for brevity
}

My Kendo Grid is typed as Accessorial (the first controller method parameter type), so my assumption is that retrieving a collection of all present rows should return an array of that model. Even so, "comments" is a string, but is only ever passed to the controller method as null.

I'm new to ASP.NET Core and Kendo, so I'm sure there is something obvious that I'm missing. Any help would be appreciated!

Answer 1

I appreciate all of the responses! I was able to finally see valid data in my controller by changing the AJAX data type to "text" and simply passing the JSON directly for deserialization server-side. For some reason this is the only way that I've been able to make this work thus far.

AJAX POST Call

function saveShiftDataToServer() {
    var grid = $("#accessorialGrid").data("kendoGrid");
    var dataSource = grid.dataSource;
    var allData = dataSource.data();

    var shiftOverview = {
        ShiftId: 0,
        UserName: "test",
        ShiftDate: null,
        LoadList: null,
        AccessorialList: allData,
        LoadInfoCorrect: true,
        Comments: ""
    };        
    var jsonData = JSON.stringify(shiftOverview);

    $.ajax({
        type: "POST",
        url: '/Home/SaveData',
        data: { json: jsonData },
        datatype: "text",
        success: function (response) {
                alert("111");
            }
        })
}

Controller Method

[AcceptVerbs("Post")]
public ActionResult SaveData(string json)
{
    JsonConvert.DeserializeObject<ShiftOverview>(json); // This produces an object with valid data!
}