Get row data in custom command

[Stefan]

Hi support team.

 

how to get the row data?  the following is currently not working..

 

<div id="grid"></div>
<script>
  $("#grid").kendoGrid({
    columns: [
      { field: "id" },
      { field: "name" },
      { command: [
        {
          // for click to work when there is template, add class "k-grid-[command.name]" to some element, otherwise the click handler will not be triggered
          name: "settings",
          template: "#= data.id # text in the command column <a class='k-button k-grid-settings'><span class='k-icon k-i-settings'></span>Settings</a>",
          click(e){
            kendo.alert("how to")
          }
        }
      ]
      }
    ],
    dataSource: [{ id: 1, name: "Jane Doe", bib: 1 }, { id: 2, name: "Jane Doe 2", bib: 1 }]
  });
</script>
</body>
</html>

[Neli]

Hello Stefan,

I would suggest taking a look at the following example in the API:

- https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.command#columnscommandclick

 click: function(e) {
            // prevent page scroll position change
            e.preventDefault();
            // e.target is the DOM element representing the button
            var tr = $(e.target).closest("tr"); // get the current table row (tr)
            // get the data bound to the current table row
            var data = this.dataItem(tr);
              /* The result can be observed in the DevTools(F12) console of the browser. */
            console.log("Details for: " + data.name);
        }

Here you will find a Dojo example based on the provided snippet in your email where the described approach is used.

I hope this helps.

 

Regards,
Neli
Progress Telerik