使用KendoUI网格，您将如何将可选图像或图标添加到行模板中

本文关键字：添加 图标 图像 网格 KendoUI 使用 | 更新日期: 2024-11-08 10:39:40

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

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

有

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

使用KendoUI网格，您将如何将可选图像或图标添加到行模板中

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

http://demos.kendoui.com/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"); }

然后将行模板应用于网格。 当数据更改时，CSS 类应显示相应的图像。

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

相关文章：