Kendo Grid rowTemplate k-button点击功能未定义

Question

我在Kendo Grid中使用K按钮。为了着色每一行，我应该使用rowTemplate和altRowTemplate选项。唯一的问题是点击功能没有正确绑定到按钮。

我收到以下错误，

（index）：1未捕获的ReferenceError：未在HTMLButtonElement.onclick（（index）：1）中定义viewProfile

代码在这里，

  myGridOptions({
    columns: [
      { field: 'name', title: 'Name', width: '160px'},
      { field: 'address', title: 'address'},
      { field: 'occupation', title: 'Occupation' },          
      { field: 'location', title: 'Location'},
      { field: 'salary', title: 'Salary' },
      { field: 'company', title: 'Company'},
      { field: 'phone', title: 'Phone'},
      //{ field: 'button', title: ' ' }
      { command: { text: 'View Profile', click: viewProfile }, title: ' ', width: '160px' }          
    ],
    dataSource: OccData,
    rowTemplate: '<tr style="background-color: rgb(246,246,246)" data-uid="#= uid #">'+
      '<td>#: name # </td>' +          
      '<td>#: address #</td>' +
      '<td>#: occupation #</td>' +
      '<td>#: location #</td>' +          
      '<td>#: salary #</td>' +
      '<td>#: company #</td>' +          
      '<td> #: phone#</td>' +
      '<td>#: education #</td>' +          
      '<td><button class="k-button" onclick="viewProfile();">View Profile</button></td>'+         
      '</tr>',
      altRowTemplate: '<tr style="background-color: rgb(255,255,255)" data-uid="#= uid #">'+
      '<td>#: name # </td>' +          
      '<td>#: address #</td>' +
      '<td>#: occupation #</td>' +
      '<td>#: location #</td>' +          
      '<td>#: salary #</td>' +
      '<td>#: company #</td>' +          
      '<td> #: phone#</td>' +
      '<td>#: education #</td>' +          
      '<td><button class="k-button" onclick="viewProfile();">View Profile</button></td>'+         
      '</tr>',        
    overflow: false
  });

我已经提到了几个链接，但找不到在rowTemplate中使用click函数的解决方案。

来自剑道开发者的任何建议!!会对我有所帮助。

Answer 1

在列定义中，您指定了click事件viewProfile。你有一个名为viewProfile的JavaScript函数吗？

Answer 2

刚搞定!!

    <div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" },
    {template: "<button class=\"show\">Show</button>"}
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ],
  dataBound: function(e) {
    //console.log("dataBound");
    this.element.find(".show").bind("click", function() {
    alert("Clicked");
  });
  }
});
</script>

谢谢，https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/events/databound

这可能有助于某人！