代码之家 › 专栏 › 技术社区 › Yanayaya

如何从控制器更新KendoUI Grids数据源?

kendo-ui asp.net-mvc jquery c#

Yanayaya · 技术社区 · 7 年前

网格

@(Html.Kendo().Grid<MyProject.Models.Cars>()
.Name("grid")
.Columns(columns => {
    columns.Select().Width(50);
    columns.Bound(c => c.Id).Title("Id");
    columns.Bound(c => c.Name).Title("Name");
    })
.DataSource(dataSource => dataSource
    .Ajax()
    .ServerOperation(true)
    .Model(model => model.Id(p => p.Id))
    .Read(read => read.Action("GetTabCars", "Test"))
))

按钮当您单击其中一个按钮时,它会将一个Id数组传递给控制器。这很好地工作,你可以在控制器中看到数组,并且它可以毫无问题地传递下去。

function tabButton(e) {
    let filter = $(e).data("filter");
    $.ajax({
        type: "POST",
        url: "/Test/GetTabCars/",
        data: { array: filter },
        success: function (response) {
            console.log("Success");
        },
        error: function (jqXHR, textStatus, errorThrown) {
            console.log(jqXHR.status);
            console.log(textStatus);
            console.log(errorThrown);
        }
    })
}

控制器 return data; 在最后一步。

public ActionResult GetTabCars(int[] array, [DataSourceRequest] DataSourceRequest request)
{
    List<Car> cars = new List<Car>();
    var car = unitOfWork.CarRepository.Get();
    DataSourceResult result = car.ToDataSourceResult(request);
    JsonResult data;

    if (array !=null)
    {
        foreach (var id in array)
        {
            cars.Add(unitOfWork.CarRepository.FindSingleOrDefault(x => x.Id == id));
        }
        data = Json(cars, JsonRequestBehavior.AllowGet);
    }
    else
    {
        data = Json(result, JsonRequestBehavior.AllowGet);
    }
    data.MaxJsonLength = int.MaxValue;
    return data;
}

2 回复 | 直到 7 年前

Ross Bush 7 年前

初始化后,可以使用数据源的read命令刷新网格:

function tabButton(e) {
    let filter = $(e).data("filter");
    var grid = $('#grid').data('kendoGrid');
    grid.dataSource.read({  array: filter });
    grid.refresh();
}

Kerlos Bekhit 7 年前

可以使用以下命令以编程方式设置网格的数据源:

$("#grid").data('kendoGrid').dataSource.data(dataToSet);

只需像这样修改js方法:

function tabButton(e) {
    let filter = $(e).data("filter");
    $.ajax({
        type: "POST",
        url: "/Test/GetTabCars/",
        data: { array: filter },
        success: function (response) {
            var result = JSON.parse(response);
            $("#grid").data('kendoGrid').dataSource.data(result);
            console.log("Success");
        },
        error: function (jqXHR, textStatus, errorThrown) {
            console.log(jqXHR.status);
            console.log(textStatus);
            console.log(errorThrown);
        }
    })
}

推荐文章

SpaceCowboy74 Mohammad Aghazadeh · 使用Fluent Validation比较数组中的值

8 月前