ajax 发布到 mvc 控制器，所有值都为空答案

【问题标题】：ajax post to mvc controller, all values are nullajax 发布到 mvc 控制器，所有值都为空
【发布时间】：2020-06-15 15:52:09
【问题描述】：

我正在使用 ASP.Net Core MVC 构建一个订单跟踪应用程序。我有一个显示所有订单的表格，并且正在尝试实现其中三列的内联编辑。我正在尝试使用 ajax 将编辑后的值发布到我的控制器，但控制器似乎没有收到任何内容。

var orderUpdate = {};
orderUpdate.Id = row.find(".Id").html();
orderUpdate.Responsible = row.find(".Responsible").find("span").html();
orderUpdate.Comments = row.find(".Comments").find("span").html();
orderUpdate.Promise_Date = row.find(".Promise_Date").find("span").html();
console.log(orderUpdate);
$.ajax({
     type: "POST",
     url: "/Orders/UpdateOrder",
     data: '{order:' + JSON.stringify(orderUpdate) + '}',
     contentType: "application/json; charset=utf-8",
});

这是我的控制器中的方法，当我编辑值时，console.writeline 为 Id 打印 0，而其他属性则不打印任何内容。

[HttpPost]
public ActionResult UpdateOrder(Order x)
{
    Console.WriteLine(x.Id);
    Console.WriteLine(x.Responsible);
    Console.WriteLine(x.Comments);
    Console.WriteLine(x.Promise_Date);

    //Order updatedOrder = (from o in _context.Orders where o.Id == order.Id select o).FirstOrDefault();
    //updatedOrder.Responsible = order.Responsible;  
    _context.SaveChangesAsync();
    return new EmptyResult();
}

这些是我模型的相关部分

 public class Order
    {
        public int Id { get; set; }
        public string Responsible { get; set; }
        public string Comments { get; set; }
        [DataType(DataType.Date)]
        public DateTime? Promise_Date { get; set; }
        ...
    }

【问题讨论】：

标签： ajax asp.net-mvc asp.net-core asp.net-ajax

【解决方案1】：

当你想将json数据传递给控制器时，你需要使用[FromBody]。

这是一个演示：

控制器：

        [HttpGet]
        public IActionResult UpdateOrder()
        {
            return View();
        }
        [HttpPost]
        public ActionResult UpdateOrder([FromBody]Order order)
        {

            return new EmptyResult();
        }

查看：

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

<h1>UpdateOrder</h1>
<button onclick="submit()">submit</button>
@section scripts{
    <script type="text/javascript">
        function submit() {
            var orderUpdate = {};
            orderUpdate.Id = 1;
            orderUpdate.Responsible = "Responsible";
            orderUpdate.Comments = "Comments";
            var order = JSON.stringify(orderUpdate);
            $.ajax({
                type: "POST",
                url: "/Test/UpdateOrder",
                data: order,
                contentType: "application/json; charset=utf-8",
            });
        }
    </script>
}

结果：

【讨论】：

【解决方案2】：

帖子正文错误。

data: '{order:' + JSON.stringify(orderUpdate) + '}'

你会得到一个 json 字符串：{order:{}}。不是 JSON 字符串，而是 JS 对象。

你应该用JSON.stringify({order: orderUpdate})序列化整个对象

【讨论】：