Adding custom button to row template

[Huw Lloyd]

Hi

I can add buttons to a command column in a grid and trigger click events fine. What I want to do now is add a command button to my row template

In the row template I have

#if (IsMe) {# <a class="k-button k-grid-delete">Delete</a> #} #

And then in my document ready function I have

$("#grid").on("click", ".k-grid-delete", function () {
              alert("click delete command");
          });

This works and the message appears whenever I click on one of the delete buttons, however what I want to do when the user clicks is make an ajax call that deletes the item from its ID property....

When using a command column I would do something like

function delete(e) {
          e.preventDefault();

          var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

i could then use dataItem.ID to reference the ID of the relevant row.

How can I do this for the button I have created above in the row template?

Many thanks

[Alexander Valchev]

Hi Huw,

In case the click event is delegated manually the context ('this' keyword) will be different. In order to obtain the data item you should use the following approach.

$("#grid").on("click", ".k-grid-delete", function (e) {
    var row = $(e.target).closest("tr");
    var grid = $("#grid").data("kendoGrid");
    var dataItem = grid.dataItem(row);
});

I hope this will help.

Regards,
Alexander Valchev
Telerik

[Huw Lloyd]

Hi,

I though what you provided worked, however row is not picking up the relevant row...

If I add 4 rows to my grid, so each row has its own delete button, then when I click delete for ANY row, it always returns the last row that was added irrespective of the row I actually selected. How do I get it to return the row I selected.

Many thanks in advance 

[Huw Lloyd]

No problem.... I was being lazy using a table within my row template for formatting so naturally the row was picking up the row within my template table...

Removed the table and replaced with Css layout and it works perfectly again!!