MVC 应用程序中 kendoUI 网格列中的图标（使用 MVC 包装器）答案

【问题标题】：Icon in kendoUI grid column in MVC application (using MVC wrappers)MVC 应用程序中 kendoUI 网格列中的图标（使用 MVC 包装器）
【发布时间】：2013-04-23 10:16:40
【问题描述】：

我在 ASP.NET MVC 应用程序中有一个页面，使用 KendoUI 制作该页面有一个分层网格（如下链接所示）

http://demos.kendoui.com/web/grid/hierarchy.html

代码运行良好。

详细信息网格绑定到以下类

public class ScheduledInspectionInfo
{
    public ScheduledInspectionInfo();

    public string CommandName { get; set; }
    public string IconPath { get; set; }
    public int InspectionID { get; set; }
    public DateTime PeriodEndDate { get; set; }
    public int PeriodNo { get; set; }
    public DateTime PeriodStartDate { get; set; }
    public int PermitID { get; set; }
}

IconName 字段包含我需要在网格中显示的图标的名称。但我不能让它工作

如果我将网格定义如下：

Html.Kendo().Grid<MyPermitNow.ScheduledInspectionInfo>()
    .Name("grid_#=PermitID#")   
    .Columns(columns =>
    {
        columns.Bound(p => p.PeriodNo).Title("No.").Width(200);
        columns.Bound(p => p.PeriodStartDate).Format("{0:d}").Width(200);
        columns.Bound(p => p.PeriodEndDate).Format("{0:d}").Width(200);
        columns.Bound(p => p.IconPath).Title("Status");
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(5)        
        .Read(read => read.Action("HierarchyBinding_SearchDetail", "Septic", new { permitID = "#=PermitID#" }))
    )
    .Pageable()
    .Sortable()
    .ToClientTemplate()

状态栏显示图标名称

但如果我将状态列定义更改如下

columns.Bound(p => p.IconPath).Title("Status").ClientTemplate("<img src='#= IconName #' />");

它给了我 JavaScript 错误：

ReferenceError: IconName is not defined

尝试展开主行以查看详细信息时

知道什么是错的吗？

谢谢

【问题讨论】：

标签： asp.net-mvc razor kendo-ui

【解决方案1】：

由于IconPath 被定义为详细信息对象，因此对于您的模板，您必须转义# 字符才能访问详细信息（#= ... # 映射到主元素的属性，\\#= ... \\# 映射到详细信息元素）。

在你的情况下，你应该使用：

columns.Bound(p => p.IconPath)
       .Title("Status")
       .ClientTemplate("<img src='\\#= IconPath \\#' />");

【讨论】：

【解决方案2】：

我想你拼错了什么。 IconName 属性从未定义。

改用 IconPath

columns.Bound(p => p.IconPath).Title("Status").ClientTemplate("<img src='#= IconPath #' />");

【讨论】：

谢谢，我拼错了，但在帖子里。