我有一个Kendo网格，可通过将下拉列表中的值推入内置kendo过滤器中进行过滤。在文本框中键入值并搜索时，可以使用相同的方法搜索网格。这是我的剑道网格和下拉菜单
@(Html.Kendo().DropDownListFor(model => model.MyObject.ID)
.Name("Objects").DataTextField("Value").DataValueField("Key")
.BindTo(@Model.MyObjectList).AutoBind(true)
.HtmlAttributes(new { id = "selectedObject" })
<a class="button" onclick="searchGrid()" id="search">Search</a>
@(Html.Kendo().Grid<MyViewModel>()
.Name("MyGrid").HtmlAttributes(new { style = " overflow-x:scroll;" })
.Columns(columns =>
{
columns.Bound(a => a.MyObject.Name).Title("Field 1");
columns.Bound(a => a.Column2).Title("Field 2");
}
.Pageable(page => page.PageSizes(true))
.Scrollable(src => src.Height("auto"))
.Sortable()
.Filterable()
.Reorderable(reorder => reorder.Columns(true))
.ColumnMenu()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(10)
.Read(read => read.Action("GetList_Read", "MyController"))
)
)
<script>
function searchGrid()
{
selectedObject = $("#selectedObject").data("kendoDropDownList");
gridFilter = = { filters: [] };
if ($.trim(selectedRecipient).length > 0) {
gridListFilter.filters.push({ field: "Field 1", operator: "eq", value: selectedObject});
}
}
var grid = $("#MyGrid").data("kendoGrid");
grid.dataSource.filter(gridFilter);
</script>
我的视图模型看起来像
public class MyViewModel
{
public MyObject myObj {get;set;}
public string Column2 {get;set;}
}
当搜索字段是文本框时，以上功能有效，但是当我使用下拉菜单时，以上功能不起作用。我认为这是因为当网格中填充了“ MyObject”的名称时，我正在将“ MyObject”的ID推送到网格过滤器中。谁能告诉我如何解决这个问题。谢谢！！
我发现有两种方法可以解决此问题。一种是将选定的值推入内置的Kendo过滤器中，或者将值传递给控制器操作并在服务器端进行过滤。首先将下拉转换事件的选定值存储到名为“ selectedDropDownValue”的对象中
过滤客户端（将值推送到剑道过滤器）
function searchGrid()
{
var gridListFilter = { filters: [] };
var gridDataSource = $("#MyGrid").data("kendoGrid").dataSource;
gridListFilter.logic = "and"; // a different logic 'or' can be selected
if ($.trim(selectedDropDownValue).length > 0) {
gridListFilter.filters.push({ field: "MyObject.MyObjectID", operator: "eq", value: parseInt(selectedDropDownValue) });
}
gridDataSource.filter(gridListFilter);
gridDataSource.read();
}
这会将下拉列表的选定值推入内置剑道网格过滤器
过滤服务器端
通过添加数据来编辑数据源读取行
.Read(read => read.Action("GetApportionmentList_Read", "Apportionment").Data("AddFilter"))
然后创建一个javascript函数以添加过滤器
function AddFilter()
{
return {filter:selectedDropDownValue};
}
然后在搜索网格中的JS函数开始于
function searchGrid()
{
var gridListFilter = { filters: [] };
var gridDataSource = $("#MyGrid").data("kendoGrid").dataSource;
gridDataSource.read();
}
读取调用之后，您仍然可以添加客户端过滤器，应用过滤器，然后再进行读取调用。控制器签名应如下所示
public JsonResult GetList_Read([DataSourceRequest] DataSourceRequest request, string filter)
过滤器将包含所选下拉列表的值
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句