Question

我正在使用NopCommerce中的telerik网格进行一些自定义。我想在我的一个名为PercentageCompleted的列中实现过滤。现在我该如何实现这个目标呢？

Answer 1

您可以查看针对MVC扩展的Telerik演示站点上的Grid的以下示例：

http://demos.telerik.com/aspnet-mvc/razor/grid

我们将此演示称为基于Telerik MVC Extension的Grid的第一眼。在此示例中，网格绑定到Northwind数据库的订单表。这是Razor View代码：

@(Html.Telerik().Grid(Model)
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(o => o.OrderID).Width(100);
            columns.Bound(o => o.ContactName).Width(200);
            columns.Bound(o => o.ShipAddress);
            columns.Bound(o => o.OrderDate).Format("{0:MM/dd/yyyy}").Width(120);
        })
        .DataBinding(dataBinding => 
        {
            dataBinding.Server().Select("FirstLook", "Grid", new { ajax = ViewData["ajax"] });
            dataBinding.Ajax().Select("_FirstLook", "Grid").Enabled((bool)ViewData["ajax"]);
        })
        .Scrollable(scrolling => scrolling.Enabled(true))
        .Sortable(sorting => sorting.Enabled(true))
        .Pageable(paging => paging.Enabled(true))
        .Filterable(filtering => filtering.Enabled(true))
        .Groupable(grouping => grouping.Enabled(true))
        .Footer((true)
)

如您所见，我们需要先设置全局开关

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

告诉Grid网格是否可过滤。一旦我们打开此开关，列集合中的所有列都将;默认情况下会对它们进行过滤。

在您的情况下，您只想启用过滤器一列。为了实现这一点，您需要在不需要它的那些列上手动关闭过滤功能。例如在上面的代码中，我想在OrderID和OrderDate列上禁用过滤器选项。实现这一目标的代码如下：

@(Html.Telerik().Grid(Model)
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(o => o.OrderID).Width(100).Filterable(false);
            columns.Bound(o => o.ContactName).Width(200);
            columns.Bound(o => o.ShipAddress);
            columns.Bound(o => o.OrderDate).Format("{0:MM/dd/yyyy}").Width(120).Filterable(false);
        })
        .DataBinding(dataBinding => 
        {
            dataBinding.Server().Select("FirstLook", "Grid", new { ajax = ViewData["ajax"] });
            dataBinding.Ajax().Select("_FirstLook", "Grid").Enabled((bool)ViewData["ajax"]);
        })
        .Scrollable(scrolling => scrolling.Enabled(true))
        .Sortable(sorting => sorting.Enabled(true))
        .Pageable(paging => paging.Enabled(true))
        .Filterable(filtering => filtering.Enabled(true))
        .Groupable(grouping => grouping.Enabled(true))
        .Footer((true)
)

希望这能回答你的问题。

Lohith（技术传播者，Telerik India）

Answer 2

将.Filterable添加到网格定义中，如此

@Html.Telerik().Grid(Model)
        .Name("Grid")
        .Filterable()

这使得所有具有简单数据类型的列都可以过滤。要指定列，请添加

.Filterable(true)

或

.Filterable(false)

到每个列定义

如何在telerik网格中过滤？

2 个答案: