JSON.stringify 作为 Null 传递到 Razor-Page

Question

我有一个 asp.net 核心剃须刀页面，我试图从 table 中读取数据并将其传递到我的控制器中，以便我可以处理在 table。我已经检查了这个网站上的其他类似问题，例如：但我一直在 razor-page 中得到一个空值。我在下面发布相关代码。如果您还有其他需要查看的内容，请告诉我。

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 Class :

 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

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

Answer 2

由于EnteredScores里面的属性都是inttype.You需要传int类型的数据给handler.Try来改变

       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..
        },
    });

结果：

JSON.stringify 作为 Null 传递到 Razor-Page

JSON.stringify Passing Into Razor-Page As Null

c#

ajax

json

asp.net-core

razor-pages