ClientTemplate表达式以包含有条件的javascript

时间:2018-10-11 17:41:09

标签: kendo-grid kendo-asp.net-mvc

已经使用Kendo UI MVC已有一段时间了,需要在网格一个字段中的复选框上放置一些条件逻辑。

网格中需要评估的字段是

从这里的例子开始
https://docs.telerik.com/aspnet-mvc/helpers/grid/faq#how-to-display-checkboxes-in-ajax-bound-grids

columns.Bound(p => p.ProductName).ClientTemplate(
    "# if (HasIcon == true) { #" +
        "<img src='" + Url.Content("~/Content/icons/") + "#= ProductID #.png' alt='#= ProductName # icon' />" +
    "# } else { #" +
        "#: ProductName #" +
    "# } #"
);

如何在条件内格式化测试以使用网格字段值? 例如
测试ProductID是否是这样的特定值?

columns.Bound(p => p.ProductName).ClientTemplate(
    "# if (#= ProductID # == 123) { #" +
        "<img src='" + Url.Content("~/Content/icons/") + "#= ProductID #.png' alt='#= ProductName # icon' />" +
    "# } else { #" +
        "#: ProductName #" +
    "# } #"
);

1 个答案:

答案 0 :(得分:1)

由于客户端模板的有时复杂性,我个人倾向于使用javascript函数方法     columns.Bound(p => p.ProductName).ClientTemplate("#= getProductIcon(data, Url.Content("~/Content/icons/")#);

然后在js脚本块中

function getProductIcon(data, imgUrl) {
   if (data.ProductID == 123)
      return "<img src='" + imgUrl + data.ProductID + ".png' alt='" + data.ProductName + " icon' />";
   else
      return data.ProductName;
}

只需确保在实例化网格之前已加载脚本,否则您将遇到getProductIcon未定义或类似错误。同样,将调试器置于javascript函数上并真正查看正在发生的情况并验证数据的输入/输出也更容易。

不好意思,我目前不在可以验证剃刀语法的位置。