Kendo Grid custom command button - Front- & Back-End Development - Front- & Back-End Development - Progress Community
 Front- & Back-End Development

Kendo Grid custom command button

  • Kendo Grid custom command button
  • Sitefinity 6.1.  I have a Kendo Grid with a custom command button in the last column with some strange behavior.  When clicking on the custom "print" button in the first row, it fires for all rows.  When clicking the print button on all other rows, I get a Javascript error stating it can't find the data item.  For example, in the code below, when I click the "print" button on the first row, the PrintDocument() function gets fired 10 times if I have 10 data items in my grid.  Any thoughts?

    // Kendo UI Grid
    function ViewDataGrid(dbData)
      
        $("#dvData").kendoGrid(
            dataSource:
                data: dbData
            ,
            resizable: true,
            reorderable: true,
            filterable: true,
            sortable: true,
            pageable: true,
            toolbar: ["create"],
        editable: "popup",
            height: 400,
            columns: [ field: "ID", width: "40", title: "ID"
                      , field: "FirstName", width: "150", title: "First Name"
                      , field: "MI", width: "40", title: "MI"
                      , field: "LastName", width: "150", title: "Last Name"
                      , command: "edit"
                      , command: name: "print", click: PrintDocument
            ]
        );
      
    function PrintDocument(e)
        e.preventDefault();
      
        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);
        alert("Details for: " + data.FirstName);