數據和按鈕在同一列劍道網格

Question

我正在處理HTML5和JavaScript。

是否可以在kendo網格中的同一列中添加數據和按鈕。

需要幫助。

Answer 1

是的，這是！只需使用它的模板。例如：

定義以下模板：

<script id="template" type="kendoui/template"> 
    <button class="ob-click-me k-button">Click me</button> 
    <span>#= LastName #</span> 
</script> 

和電網爲：

var grid = $("#grid").kendoGrid({ 
    dataSource: ds, 
    ... 
    columns : 
    [ 
     { field: "FirstName", width: 90, title: "First Name" }, 
     { 
      field: "LastName", 
      width: 200, 
      title: "Last Name", 
      template: $("#template").html() 
     } 
    ] 
}).data("kendoGrid"); 

你可以看到正在運行的例子，甚至定義爲這裏的按鈕的處理程序：http://jsfiddle.net/OnaBai/qe3tf4tx/

Answer 2

同樣在查看頁面中，您可以使用ClientTemplate實現此目的：

@(Html.Kendo().Grid<ViewModel>().Name("grid") 
        .DataSource(src => src.Ajax().PageSize(10).Read(read => read.Action("Action", "Controller")) 
        .Columns(col => 
        { 
         col.Bound(e => e.Name).ClientTemplate("<input type='button' value='CLICK' onclick='XYZ();'><label>#= (Name== null) ? ' ' : Name #</label>"); 
        }) 
        .Selectable() 
        .Scrollable() 
      )