MVC应用程序中的kendo UI网格列中的图标(使用MVC包装器)

时间:2013-04-23 10:16:41

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

我在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

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

知道什么是错的吗?

谢谢

2 个答案:

答案 0 :(得分:4)

由于定义了IconPath是详细信息对象,因此对于模板,您必须转义#字符才能访问详细信息(#= ... #映射到主元素的属性, \\#= ... \\#到详细信息元素。)

在您的情况下,您应该使用:

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

答案 1 :(得分:0)

我觉得你错了一些东西。永远不会定义IconName属性。

尝试使用IconPath

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