Using the cancel Event with JavaScript with Tag Helper

[Jens]

We have a complicated Kendo Grid with Tag Helper notification. We need to use On Cancel Event within edit operation, by pressing Cancel button. Here is an example (but not Tag Helper)

@(Html.Kendo().Grid<MyModel>()
    .Name("grid")
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Events(events => events.Cancel("onCancel")) // JavaScript event handler
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(m => m.Id))
        .Read(read => read.Action("Read", "Controller"))
        .Update(update => update.Action("Update", "Controller"))
    )
    .Columns(columns =>
    {
        columns.Bound(c => c.Id).Editable(false);
        columns.Bound(c => c.Name);
        columns.Command(command => command.Edit());
    })
)

<script>
    function onCancel(e) {
        console.log("Edit operation was canceled.");
        // e.container is the jQuery object of the edited row or cell.
        // You can use this function to handle custom logic after canceling
    }
</script>

[Eyup]

Hello Jens,

 

Thank you for writing to us.

You can achieve this requirement using the following approach:

<kendo-grid ... on-cancel="cancel_handler">

JS:

    function cancel_handler(e){
        alert("Editing cancelled");
    }

Here is a live sample I have prepared for your convenience:
https://netcorerepl.telerik.com/wSlOOjvp04nEl0GG26

Do you find this sample beneficial? Let me know what you think.

 

Regards,
Eyup
Progress Telerik

[Jens]

Thank you for your answer. It has helped me.