滤波时，肯德尔(Kendo)Telerik网格中可能进行条件格式

Question

当应用滤波器时，我想更改肯德尔电视网格中的行背景颜色。我有和ASP.NET MVC应用程序。有可能吗？

Answer 1

kendo的网格具有内置的选项，可以更改TR s的显示方式，称为rowTemplate。问题是，当您使用它时，您必须处理整个行创建：

columns: [{
    title: "Id",
    field: "Id"
}],
rowTemplate: kendo.template($("#grid-template").html()),
filter: function() {
    rowAlt = 0; // This is a global variable
}

和模板：

<script id="grid-template" type="text/x-kendo-template">
# let filter = $("#grid").data("kendoGrid").dataSource.filter();
#<tr class='#
if (++rowAlt % 2 == 0) {
    #k-alt #
}
if (filter != null) {
    #filtered-row#
}
#'><td>#=data.Id#</td>#
#<tr>##
</script>

演示

---

现在，还有另一种方法，这意味着可以自定义其外部网格样式，如其他用户所提出的那样。它使网格的初始化变得简单，并在渲染行后处理样式(在dataBound事件中(：

filterable: true,
columns: [{
    title: "Id",
    field: "Id"
}],
dataBound: function() {
    window.setTimeout(function() {
        if (this.dataSource.filter()) {
          this.tbody.find("tr").addClass("filtered-row");
        }
    }.bind(this), 1);
}

演示

_{注意：我正在上面的摘要中使用setTimeout，因为有时在DOM Elements完成渲染之前会调用dataBound事件。}

上面的两个示例我使其在网格被过滤时在行中添加了BG颜色，您必须基于dataSource.filter()结果对象制作条件，其中包含所有过滤器设置。

Answer 2

您可以创建一个函数来检查kendo网格上是否存在任何过滤器，然后浏览现有的网格行，并将最近的背景色设置为您想要的任何过滤器。