How to mark a row in Kendo Grid as deleted until the Save Changes is pressed?

Question

I am using the

{ command: "destroy", title: " ", width: 150 }]

in my columns and also having the CRUD set up in my grid. But I want to be able to mark the row as deleted when the delete button is pressed. Then delete the row from the Grid and database when the save changes is pressed.

What is happening now is the row is deleted from the grid as soon as the delete button is pressed and then when I press save changes it is also removed from the database.

What I have done is similar to:

http://demos.telerik.com/kendo-ui/grid/editing

Thanks if you could give me ideas.

Answer 1

I would not use the built-in destroy and save commands.

Instead, create your own custom delete and save.

On the delete, get the row/model and set a flag on it, i.e. model.deleted = true and add your deleted styling, either through a row template that looks at the deleted field or .addClass("deleted")...however you like.

On the save, loop through the dataSource and for each row/model with deleted = true and remove it from the dataSource. Then call the dataSource.sync().

http://dojo.telerik.com/@Stephen/EQoPO

Of course, you will have to handle reapplying the styling on paging/sorting/etc...basically any action that causes the grid to redraw and/or handle retaining the deleted state if you use server-side instead of client-side paging/sorting, similar to this: https://stackoverflow.com/a/14469942/4825632