Kendo Grid custom command button

Posted by Community Admin on 04-Aug-2018 12:27

Kendo Grid custom command button

All Replies

Posted by Community Admin on 09-Oct-2013 00:00

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);

This thread is closed