jquery – Kendo Grid – 搜索后绑定数据

ASP.NET MVC 4 | .NET 4.5 |剃刀| C#

我在页面顶部有一个文本框和一个按钮.下面是一个Kendo Grid,它绑定到我的视图模型中的List.当用户单击搜索按钮时,将发出jQuery ajax请求,并将数据作为JSON返回.我唯一的问题是如何将数据绑定到我的Kendo Grid？任何帮助表示赞赏.

@(Html.Kendo().Grid(Model.PurchaSEOrder.LineItems)
    .Name("poSearchGrid")
    .Columns(c =>
    {
        c.Bound(x => x.LineNumber).Title("Line Number");
        c.Bound(x => x.Qty).Title("PO Qty");
        c.Bound(x => x.OpenQty).Title("Open Qty");
        c.Bound(x => x.QtyReceived).Title("Qty Received");
    })
    .Events(e => e.DataBound("onDataBound"))
    .DataSource(s => s.Ajax().Model(model => model.Id(i => i.ID)))
    )

按钮单击Ajax调用

$("#btnSearch").on('click',function() {
console.log("click");
var searchText = $("#PONumber").val();

if (searchText == "") {
    alert("You must enter a search value");
    return;
}

    $.ajax({
        url: '@Url.Action("Search")',data: { poNumber: searchText},type: 'POST',dataType: "json",success: function(result) {

        }
    });
});

解决方法

一切你需要的：

1-您的结果对象必须是Model.PurchaSEOrder.LineItems的相同类型,并且它必须是JSON对象.如果您使用MVC ActionResult,您可以在ServerCode中使用以下代码：

return Json(lineItems);

2-在你的成功ajax调用中使用下面的代码：

var grid = $('#poSearchGrid').getKendoGrid(); //Or $('#poSearchGrid').data("kendoGrid");
grid.dataSource.data(result);
grid.refresh();