MVC 中的 KENDO UI 网格：有没有办法在某些列上隐藏过滤器？

Posted 2023-05-07

【中文标题】MVC 中的 KENDO UI 网格：有没有办法在某些列上隐藏过滤器？

【英文标题】：KENDOUI grid in MVC: Is there a way to hide filters on some columns?

【发布时间】：2012-12-22 19:05:36

【问题描述】：

我在 MVC.NET 中使用 KENDO UI 网格。

网格被配置为为每一列显示一个列过滤器。

不过，我的某些列不可过滤，所以我想隐藏过滤器。

有没有办法从 C# 端进行配置？ （不使用 CSS 或 JS）。

【参考方案1】：

在您的代码中，您可能有类似的内容：

<asp:Content ContentPlaceHolderID="MainContent" runat="server">
<%: html.Kendo().Grid(Model)
    .Name("Grid")
    .Columns(columns =>
    
        columns.Bound(p => p.ProductID).Groupable(false);
        columns.Bound(p => p.ProductName);
        columns.Bound(p => p.UnitPrice);
        columns.Bound(p => p.UnitsInStock);
    )
    .Groupable()
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Products_Read", "Grid"))
    )
%>
</asp:Content>

如果您希望ProductID 列不可过滤，您应该说：

<asp:Content ContentPlaceHolderID="MainContent" runat="server">
<%: Html.Kendo().Grid(Model)
    .Name("Grid")
    .Columns(columns =>
    
        columns.Bound(p => p.ProductID).Groupable(false).Filterable(false);
        columns.Bound(p => p.ProductName);
        columns.Bound(p => p.UnitPrice);
        columns.Bound(p => p.UnitsInStock);
    )
    .Groupable()
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Products_Read", "Grid"))
    )
%>
</asp:Content>

【参考方案2】：

如果您没有设置列，您可以在网格初始化后隐藏过滤器按钮，例如在数据绑定事件中。这是一种方法，将过滤器按钮隐藏在特定字段上：

$("#MyGrid").find(".k-header[data-field='Pct_positive']").find(".k-grid-filter").css("visibility","hidden");

要将它们全部隐藏...

$("#MyGrid").find(".k-header").find(".k-grid-filter").css("visibility","hidden");

【参考方案3】：

据我所知，对于那些不想过滤的列，您必须能够将 columns.filterable 配置属性设置为“false”，因为它默认为“true”（请参阅​​文档： columns.filterable)

您是否可以从 C# 端执行此操作将取决于您的代码中如何初始化 Kendo Grid。

【讨论】：

我认为 columns.filterable 适用于所有列。没有办法设置我能找到的各个列。

要指定每列，您需要在“columns”数组中提供一个条目，并将可过滤属性设置为 false。同样，这可能是不可能的，具体取决于您的代码是如何设置来创建网格的

【参考方案4】：

我没有在问题中提到它，但是我使用了网格的 AutoGenerate() 功能，因此无法轻松访问 Filterable 设置。

这种情况的一种解决方法是：

var gb = Html.Kendo().Grid(data).Name("test");
gb.Columns(columns =>  columns.AutoGenerate(true); );

// !!! Hide filter for first column in grid.
gb.Columns( (columns) =>  (columns.Container.Columns[0] as IGridBoundColumn).Filterable=false;  );

gb.Filterable(filtering => filtering.Enabled(true));

gb.DataSource(ds => ds
                .Ajax()
                .ServerOperation(true)
                .Model(model => model.Id("A"))
                );
gb.Render();

【参考方案5】：

对于客户端（jquery）剑道网格，您可以将 filterable: false 用于放置 filterable: true 后的单个列，用于整个网格。

例如。

字段：“Margin01”， 宽度：40， 可过滤：假， 标题：“0-”