kendo ui grid repeat the destroy action on error

Question

I have a grid similar to the code below. if an errors occurs on destroy action they accumulate.
for example the on the first error 1 call to destroy action, the second 2 calls, the third error 3 calls .......
after some investigation I found out that the items to be sleeted are stored in an array (_destroyed) in the dataSource,
so every time the destroy button is clicked the destroy action is called for each of these items.

I tried assigning null to the _destroyed array but this gave js error when I called destroy action again.

@(Html.Kendo().Grid<someType>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.Name);            
            columns.Command(command => 
            { 
                command.Edit();
                command.Destroy();
            }).Width(250);
        })            
        .Editable(editable => { editable.Mode(GridEditMode.PopUp); editable.TemplateName("myTemplate"); })
        .Pageable()
        .Sortable()
        .Filterable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(50)
            .Events(events => events.Error("error_handler"))
            .Model(model => model.Id(p => p.Id))
            .Create(update => update.Action("EditingPopup_Create", "myController"))
            .Read(read => read.Action("EditingPopup_Read", "myController"))
            .Update(update => update.Action("EditingPopup_Update", "myController"))
            .Destroy(update => update.Action("EditingPopup_Destroy", "myController"))
        )

 <script type="text/javascript">
        function error_handler(e) {
            if (e.errors) {
                var message = "Errors:\n";
                $.each(e.errors, function (key, value) {
                    if ('errors' in value) {
                        $.each(value.errors, function () {
                            message += this + "\n";
                        });
                    }
                });
                alert(message);

                $(".k-grid").each(function () {
                    var grid = $(this).data("kendoGrid");
                    if (grid !== null && grid.dataSource == e.sender) {
                        grid.one('dataBinding', function (e) {
                            e.preventDefault();
                        });

                        grid.dataSource.read();
                        grid.refresh();
                    }
                });
            }
        }
</script>

a

Answer 1

You can call the cancelChanges method of the data source and then read. There is no need to call grid.refresh() as it will be called automatically when dataSource.read() is done.