Kendo Grid prevent Editing while Grid Is in Edit Mode

I’m using this method to prevent editing while grid is in edit mode. But I still found some bug on it. For example, first I clicked on Add New Record and a new row will appear. Then I click on the header of the grid (refer image below). What happen a row is created which I’m not finish yet to edit. And if I clicked on Add New Record again row will duplicate. Any solution how to solve this issue?

DOJO SAMPLE

Answer

It looks like this is a known limitation in the inline edit mode, but there is a workaround provided by Telerik here.

The workaround is nearly identical to the code you added to prevent editing while editing, except the selector used is to track mousedown on the header rows for sorting.

Here is the code for the workaround to prevent sorting when an add/edit is being done:

$(".k-grid").on("mousedown", ".k-grid-header th", function (e) {
    // prevent sorting/filtering for the current Grid only
        var grid = $(this).closest(".k-grid");
        var editRow = grid.find(".k-grid-edit-row");

        // prevent sorting/filtering while any Grid is being edited
        //var editRow = $(".k-grid-edit-row");

        if (editRow.length > 0) {
            alert("Please complete the editing operation before sorting or filtering");
            e.preventDefault();
        }
});

And I have updated your dojo with the fix as well.