Kendo mvc Grid ClientTemplate javascript函数不起作用答案

【问题标题】：Kendo mvc Grid ClientTemplate javascript function not workingKendo mvc Grid ClientTemplate javascript函数不起作用
【发布时间】：2016-03-23 11:57:16
【问题描述】：

我有一个 Kendo mvc Grid 并使用客户端模板作为列，我在模板中编写了一个 javascript 函数来返回脚本块，但它似乎不起作用并且没有 javascript 错误。我也尝试直接将脚本写入客户端模板，但它也不起作用。

//客户端模板中的html

    .Columns(columns =>
    {

     columns.Template(e =>
     { }).ClientTemplate(

         "<div class='table-responsive'>" +
              "<table border='0' class='table' >" +

                 ...................................                

              "</table>" +
         "</div>"+
          "#=AlignDiv(Id)#"
                         );
      })

//将脚本块作为字符串返回的javascript函数

      <script type="text/javascript">
      function AlignDiv(Id) {
      var result = "<script> $('.calDiv"+Id+"').map(function () {" +
           "return $(this).Height();" +
       "}).get()," +
       "maxHeight = Math.max.apply(null, heights);" +
       "$('.calDiv" + Id + "').height(maxHeight);" +
        "alert('test')<\/script>";
      return result;
  }

非常感谢，丹尼斯

【问题讨论】：

标签： javascript jquery asp.net-mvc kendo-grid kendo-asp.net-mvc

【解决方案1】：

要使用有条件选择的操作来格式化 Kendo Grid Column 值，您可以使用以下合适的示例之一。更多信息：How Do I Have Conditional Logic in a Column Client Template?

Javascript 用户界面：

{
    field: "EmployeeName", type: "string", width: "55px", title: "Employee Name", 
            template: "#= GetEditTemplate(data) #"
}

MVC 用户界面：

...
columns.Bound(t => t.EmployeeName)
.Title("Status Name")
.Template(@<text></text>)
.ClientTemplate("#= GetEditTemplate(data)#").Width("55px");
...

Javascript 方法：

<script>
//Change the color of the cell value according to the given condition
function GetEditTemplate(data) {
    var html;

    if (data.StatusID == 1) {
        html = kendo.format(
        //"<a class=\"k-button\" href='" + '@Url.Action("Edit1", "Controller")' + "/{0}" + " '>Edit</a>  ",
        "<span class='text-success'>" +
        data.EmployeeName
        + "</span>"
        );
    }
    else {
        html = kendo.format(
        //"<a class=\"k-button\" href='" + '@Url.Action("Edit2", "Controller")' + "/{0}" + " '>Edit</a>  ",
        "<span class='text-danger'>Cancel</span>"
        );
    }
    return html;
}
</script>

希望这会有所帮助...

【讨论】：