首页 > 解决方案 > 从 View 传递 JSON 数据时的空模型

问题描述

我目前正在尝试将数据从 AJAX 传递到控制器,但是,模型总是显示为空/计数 = 0。

AJAX 调用:

$("#btnSubmit").click(function(e) {
    e.preventDefault();
    var _this = $(this);
    var url = _this.closest("form").attr("action");

    var rows = [];
    var items = $(".itemRow");

    $.each(items, function(i, item) {
      var tbOne = $(item).find("input[name='tbOne']").val();
      var tbTwo = $(item).find("input[name='tbTwo']").val();

      var row = {
        Test1: tbOne,
        Test2: tbTwo
      };
      rows.push(row);
    });

    //Let's post to server
    $.ajax({
        type: "POST",
        url: url,
        data: rows,
        contentType: "application/json"
      })
      .done(function(result) {
        //do something with the result
      })

  });
});

模型:

public class Test
{
    public string Test1 {get; set;}
    public string Test2 {get; set;}
}

控制器:

[HttpPost]
public ActionResult Insert(<SomeOtherModel> otherModel, IEnumerable<Test> model)
{
    foreach (var item in model)
    {
        // to do here
    }
}

我不确定我错过了什么......我试图搜索其他帖子,他们做了与我做的相对相同的事情。但我只是无法将数据发送到我的控制器..

标签: javascriptjqueryjsonajax.net-core

解决方案


首先,您将一个模型传递给控制器​​,因此 Action 应该只有一个参数。此外,您的 contentType 是"application/json",并且您的数据不是 json 数据。此外,如果您想将 json 数据传递给控制器​​,您需要使用 [FromBody ]。

这是一个演示:

控制器:

    [HttpGet]
    public ActionResult Insert()
    {
        return View();
    }
    [HttpPost]
    public ActionResult Insert([FromBody]IEnumerable<Test> model)
    {
        return View();
    }

查看:</p>

@{
    ViewData["Title"] = "Insert";
}

<h1>Insert</h1>
<button id="btnSubmit">submit</button>
@section scripts{ 
<script type="text/javascript">
    $("#btnSubmit").click(function () {

        var rows = new Array();
        var row = {};
        row.Test1 = "test1";
        row.Test2 = "test2";
        rows.push(row);
        var row1 = {};
        row1.Test1 = "test11";
        row1.Test2 = "test21";
        rows.push(row1);
        var model = JSON.stringify(rows);

        //Let's post to server
    $.ajax({
        type: "POST",
        url: "Insert",
        data: model,
        contentType: "application/json; charset=utf-8"
    });

});
</script>
}

结果: 在此处输入图像描述


推荐阅读