如何从 Kendo Grid 数据源将对象发送到控制器？

Question

我有一个剑道网格，它使用剑道数据源，我不习惯使用剑道数据源进行内联编辑，通常我永远不会进行内联编辑，但我被要求这样做。

我的数据源如下

function PriceLookupGridDataSource() {
    var dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "../KendoGridTesting/GetThePriceLookupGrid",
                dataType: "json"
            },
            update: {
                url: function(item) {
                    console.log(item);
                    return "../KendoGridTesting/PassAnObject?myObj=" + item; 
                }
            }
        },
        schema: {
            model: {
                id: "MaterialTypeID",
                fields: {
                    VendorID: { type: "number" },
                    VendorName: { type: "string" },
                    Description: { type: "string" },
                    MaterialTypeID: { type: "number" },
                    MaterialType: { type: "string" },
                    ServicePrice: { type: "string" },
                    SellUOM: { type: "string" },
                    Cost: { type: "string" },
                    PurchaseUOM: { type: "string" }
                }
            }
        },
        batch: false,
        pageSize: 20
    });

    return dataSource;
}

用于传输更新的控制器方法是

[HttpPost]
public void PassAnObject(PriceLookupGrid myObj)
{
    ...
}

对象是

对象 {VendorID: 26, VendorName: "ACME STONE MASONRY", Description: "Special Stone Quote", MaterialTypeID: 35, MaterialType: "Cladding"…}

PriceLookupGrid 数据类是

public class PriceLookupGrid
    {
        public int VendorID { get; set; }
        public string VendorName { get; set; }
        public string Description { get; set; }
        public int MaterialTypeID { get; set; }
        public string MaterialType { get; set; }
        public string NewPrice { get; set; }
        public string RemodelPrice { get; set; }
        public string ServicePrice { get; set; }
        public string SellUOM { get; set; }
        public string Cost { get; set; }
        public string PurchaseUOM { get; set; }
    }

当我尝试将其传递给我的控制器时，我得到一个错误

GET http://localhost:51193/KendoGridTesting/PassAnObject?id=[object%20Object]&V….0000&ServicePrice=0.0000++++&SellUOM=Each&Cost=0.0000&PurchaseUOM=EachBBB 404（未找到）

它将“项目”作为单独的参数传递，我不希望这种情况发生。

有什么想法吗？

Answer 1

您的 Action 应该是用 [HttpPost] 装饰的，但您的错误消息表明您正在执行 GET。你需要剑道来POST数据，而不是：

update: {
    url: "../KendoGridTesting/PassAnObject",
    type: "post" 
}

Answer 2

这是因为item 是一个对象，正如您在控制台中看到的那样。您不能只将其连接到 url 字符串中。你来解析它。它有一个名为models 的属性，其中包含将发送到服务器的网格的所有更改（或脏）行。

为了使 ASP.Net MVC 将您的数据绑定到您的模型中，您必须发送如下日期：

../KendoGridTesting/PassAnObject?VendorID=1&VendorName=...

将数据“解析”到 url 的简单方法是：

var model = {VendorID: 26, VendorName: "ACME STONE MASONRY", Description: "Special Stone Quote", MaterialTypeID: 35, MaterialType: "Cladding"};

function modelToUrlParams(model) {
  var params = [];
  
  Object.keys(model).forEach(key => params.push(key + "=" + model[key]));
  
  return encodeURI("?" + params.join("&"));
};

var myUrl = "../KendoGridTesting/PassAnObject" + modelToUrlParams(model);

console.log("Final Url", myUrl);