asp.net-mvc – 用于选择的KendoUI网格Ajax绑定参数

我的ASP.NET MVC应用程序有一个基本的KendoUI网格,它使用ajax绑定进行读取.我想加强这一点,以便网格上方的表单用于帮助选择应该在网格中显示的数据.这是一个标准的搜索表单,带有搜索按钮等基本字段,如名字,姓氏,出生日期,客户来源等.当按下搜索按钮时,我想强制网格通过使用上面引用的字段传入搜索模型,从控制器获取满足条件的数据.

搜索表单包含在_CustomerSearch部分视图中.

通过点击OnDataBinding客户端事件并在其中更新参数值,然后手动进行Ajax调用来获取数据,我已经通过Telerik MVC扩展实现了这种事情.它不会出现KendoUI将以相同的方式运行.

视图

@Html.Partial("_CustomerSearch",Model)
<hr>
@(Html.Kendo().Grid<ViewModels.CustomerModel>()    
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.Id).Hidden(true);
        columns.Bound(p => p.FirstName);
        columns.Bound(p => p.LastName);
        columns.Bound(p => p.DateOfBirth).Format("{0:MM/dd/yyyy}");
        columns.Bound(p => p.IsActive);
    })
    .Scrollable()
    .Filterable()
    .Sortable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("_Search","Customer"))
    )
)

调节器

public ActionResult _Search([DataSourceRequest]DataSourceRequest request)
{
    return Json(DataService.GetCustomers2().ToDataSourceResult(request));
}

我设想控制器看起来像这样,但是找不到任何正在实现的例子,这是我需要帮助的.

public ActionResult _Search([DataSourceRequest]DataSourceRequest request,CustomerSearchModel customerSearchModel)
{
    return Json(DataService.GetCustomers2(customerSearchModel)
               .ToDataSourceResult(request));
}

解决方法

所以我想你有理由手动进行搜索,所以这里是我们在我们的项目中完成的(所以也许有更简单的方法,但这仍然适用于我们)：

控制器动作很好：

public ActionResult _Search([DataSourceRequest]DataSourceRequest request,CustomerSearchModel customerSearchModel)
{
    return Json(DataService.GetCustomers2(customerSearchModel)
               .ToDataSourceResult(request));
}

下一步：您需要一个从搜索表单收集数据的JavaScript函数(JS对象的属性名称应与CustomerSearchModel的属性名称相匹配)：

function getAdditionalData() {
    // Reserved property names
    // used by DataSourceRequest: sort,page,pageSize,group,filter
    return {
        FirstName: $("#FirstName").val(),LastName: $("#LastName").val(),//...
    };
}

然后,您可以在每次读取时配置此函数：

.DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("_Search","Customer")
                          .Data("getAdditionalData"))
    )

最后在你的按钮点击你只需要刷新网格：

$('#Grid').data('kendoGrid').dataSource.fetch();

（编辑：日照站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!