c# - 使用 KendoUI Grid，如何将可选图像或图标添加到行模板中？

Question

我是 KendoUI 的新手。（谁错了？）我有一个网格，我正在使用行模板。我的数据集包含几个布尔值。我想在产品名称之后插入一个图标作为产品状态的视觉指示器。

例如，如果产品低于阈值计数，我想显示一个低库存图标。如果产品的订单多于库存，我想显示一个不同的警告图标。所以大多数产品不会有任何图标。但有些可能有多个图标。

有没有人对这个问题有很好的解决方案？我将如何格式化模板，以便我可以根据布尔值显示或隐藏图标？

Answer 1

您可以使用 RowTemplate 根据单元格的值设置 CSS 类。

http://demos.kendoui.c​​om/web/grid/rowtemplate.html

例如，考虑一个有 2 列的网格，名称和状态。您可以制作如下行模板：

var rowTemplate = "<tr><td class='#= Status #'></td><td>#= Name #</td></tr>";

并为每个状态制作 CSS 类：

.status1 { background-image: Url("/images/status1image.gif"); }
.status2 { background-image: Url("/images/status2image.gif"); }

然后将 RowTemplate 应用于网格。随着数据的变化，CSS 类应该显示适当的图像。

我还没有完全尝试过 - 但它应该可以正常工作。