JSON.stringify 作为 Null 传入 Razor-Page

Question

我有一个 asp.net core razor-page，我试图从表中读取数据并将其传递给我的控制器，以便我可以处理表中所做的更改。我在这个网站上检查了其他类似的问题，比如这个：MVC model is null when posting json in ASP.Net Core 但我在剃刀页面中不断得到一个空值。我在下面发布相关代码。如果您还有其他需要查看的内容，请告诉我。

下面的 Ajax 调用：

 //--------------------------------------------------------------------
 // Load Up An Array and Pass the Data To The Razor Page
 //--------------------------------------------------------------------
 $('#UpdateScoresButton').click(function () {
   // Store Data in an Array
    var enteredScores = new Array();
   // Loops through whole table
   $("#table tbody tr").each(function () {
     // Grabs Each Row
       var row = $(this);
       var score = {};
       score.DeputyID = row.find("td").eq(0).html();
       score.DivisionID = row.find("td").eq(1).html();
       score.QuarterID = row.find("td").eq(2).html();
       score.PrimaryModelID = row.find("td").eq(3).html();
       score.SecondaryModelID = row.find("td").eq(4).html();
       score.ShotgunModelID = row.find("td").eq(5).html();
       score.RifleModelID = row.find("td").eq(6).html();
       score.PrimaryFirstScoreID = row.find("td").eq(7).html();
       score.PrimarySecondScoreID = row.find("td").eq(8).html();
       score.PrimaryThirdScoreID = row.find("td").eq(9).html();
       score.SecondaryScoreID = row.find("td").eq(10).html();
       score.ShotgunScoreID = row.find("td").eq(11).html();
       score.RifleScoreID = row.find("td").eq(12).html();

       enteredScores.push(score);
});    

$.ajax(
    {
        url: '/EnterScores/Enter_Shooter_Scores?handler=InsertUpdateAndReloadData',
        beforeSend: function (xhr) {
            xhr.setRequestHeader("XSRF-TOKEN",
                $('input:hidden[name="__RequestVerificationToken"]').val());
        },
        type: 'POST',
        dataType: 'application/json; charset=utf-8',
        data: JSON.stringify(enteredScores),
        success: function (result) {
            if (result.pass != undefined) {
                document.forms[0].submit();
            }
        },
        error: function (result, exception) {
            console.log(result);
            // Your error handling logic here..
        },
    });
});

这是剃须刀页面代码：

public JsonResult OnPostInsertUpdateAndReloadData([FromBody] List<EnteredScores> enteredScores)
{
  var test = enteredScores;            
  return new JsonResult(new { pass = "Pass" }); ;
}

我的 EnteredScores 课程：

 public class EnteredScores
{
    public int DeputyID { get; set; }
    public int DivisionID { get; set; }
    public int QuarterID { get; set; }
    public int PrimaryModelID { get; set; }
    public int SecondaryModelID { get; set; }
    public int ShotgunModelID { get; set; }
    public int RifleModelID { get; set; }
    public int PrimaryFirstScoreID { get; set; }
    public int PrimarySecondScoreID { get; set; }
    public int PrimaryThirdScoreID { get; set; }
    public int SecondaryScoreID { get; set; }
    public int ShotgunScoreID { get; set; }
    public int RifleScoreID { get; set; }     
}

Answer 1

由于 EnteredScores 中的属性是 int 类型的，所以需要将 int 类型的数据传递给 handler。尝试改变

       score.DeputyID = row.find("td").eq(0).html();
       score.DivisionID = row.find("td").eq(1).html();
       score.QuarterID = row.find("td").eq(2).html();
       score.PrimaryModelID = row.find("td").eq(3).html();
       score.SecondaryModelID = row.find("td").eq(4).html();
       score.ShotgunModelID = row.find("td").eq(5).html();
       score.RifleModelID = row.find("td").eq(6).html();
       score.PrimaryFirstScoreID = row.find("td").eq(7).html();
       score.PrimarySecondScoreID = row.find("td").eq(8).html();
       score.PrimaryThirdScoreID = row.find("td").eq(9).html();
       score.SecondaryScoreID = row.find("td").eq(10).html();
       score.ShotgunScoreID = row.find("td").eq(11).html();
       score.RifleScoreID = row.find("td").eq(12).html();

到

        score.DeputyID = parseInt(row.find("td").eq(0).html());
        score.DivisionID = parseInt(row.find("td").eq(1).html());
        score.QuarterID = parseInt(row.find("td").eq(2).html());
        score.PrimaryModelID = parseInt(row.find("td").eq(3).html());
        score.SecondaryModelID = parseInt(row.find("td").eq(4).html());
        score.ShotgunModelID = parseInt(row.find("td").eq(5).html());
        score.RifleModelID = parseInt(row.find("td").eq(6).html());
        score.PrimaryFirstScoreID = parseInt(row.find("td").eq(7).html());
        score.PrimarySecondScoreID = parseInt(row.find("td").eq(8).html());
        score.PrimaryThirdScoreID = parseInt(row.find("td").eq(9).html());
        score.SecondaryScoreID = parseInt(row.find("td").eq(10).html());
        score.ShotgunScoreID = parseInt(row.find("td").eq(11).html());
        score.RifleScoreID = parseInt(row.find("td").eq(12).html());

而且由于您传递的数据是 json 类型，因此您需要将 contentType: "application/json", 添加到您的 ajax 中，如下所示：

$.ajax(
    {
        url: '/EnterScores/Enter_Shooter_Scores?handler=InsertUpdateAndReloadData',
        beforeSend: function (xhr) {
            xhr.setRequestHeader("XSRF-TOKEN",
                $('input:hidden[name="__RequestVerificationToken"]').val());
        },
        type: 'POST',
        contentType: "application/json",
        dataType: 'application/json; charset=utf-8',
        data: JSON.stringify(enteredScores),
        success: function (result) {
            if (result.pass != undefined) {
                document.forms[0].submit();
            }
        },
        error: function (result, exception) {
            console.log(result);
            // Your error handling logic here..
        },
    });

结果：

Answer 2

您的问题可能是由于模型绑定失败。查看这段代码，我要解决的第一个问题是 Javascript 对象名称 [您传递给 C#/MVC 操作] 和“EnteredScores”模型/类属性的区别。最简单的重构是像这样编辑您的 Javascript 代码：

score.DeputyID = row.find("td").eq(0).html();
score.DivisionID = row.find("td").eq(1).html();
score.QuarterID = row.find("td").eq(2).html();
etc.

将上面的 [您的原始代码] 更改为下面的 [我对该代码的重构]，只需确保更新所有字段以使其匹配即可。

DeputyID = row.find("td").eq(0).html();
DivisionID = row.find("td").eq(1).html();
QuarterID = row.find("td").eq(2).html();
etc.