编辑KendoGrid模板的更简洁的方法

Cleaner way to edit KendoGrid template

本文关键字:方法 简洁 KendoGrid 编辑      更新时间:2023-09-26

我想为我的KendoGird使用自定义模板,并且我在网格
中嵌套了详细信息这是我的代码:

@(Html.Kendo()
      .Grid(Model)
      .Name("grid")
      .Columns(columns =>
          {
              columns.Template(@<text></text>)
                     .ClientTemplate(
                          "<div>" +                                      
                          "<div style='"float:left'">#= SomeFeild1#</div>" +                                      
                          "<div style='"clear:both;'">" +
                          "#= SomeFeild2#" +
                          "</div>" +
                          "<div class='"attache'" style='"clear:both'">" +
                          "#=CreateGrid(Id)#" +
                          "</div>" +                                     
                          "</div>");
          })
   .Sortable()
   .Pageable()
   .DataSource(dataSource => dataSource
                   .Ajax().PageSize(20)
                   .ServerOperation(false)))

这个JavaScript函数以html形式返回嵌套的细节:

function CreateGrid(id) {
    return "Some more html";
}

一切都很好,但一团糟,如果我想做出最轻微的改变
,那将很困难我怎样才能以更清洁的方式做到这一点?

你可以这样做:

 columns.Bound(p => p.Column1).ClientTemplate("#= getTemplate() #");
<script>
function getTemplate() {
    var html = kendo.format("<a href='{0}/{1}'>Show Product Details</a>",
        param1,
        param2
    );
    return html;
}
</script>

此链接中的更多信息