Editable Grid - cancel button destroying all changes

[Lynx IT]

When using editable grids, while editing a row for the second time and clicking cancel, all changes are lost to the row. Expected behavior is for the current changes to be cancelled only.

To reproduce:

http://jsfiddle.net/getBalian/gHZMp/
1. Edit a row and click update
2. Edit the same row and click cancel

The row reverts back to its starting state.

If you uncomment the transport update options, the jsfiddle will work but it is not an option for us to use the ajax transport update option, as there are multiple grids on the same page which must be submitted at the same time. Is there a workaround for this, so the grid rows will not reset?

Any help would be greatly appreciated.

[Dimo]

Hi Joseph,

The Kendo UI DataSource keeps no history of all changes to a particular field. Only the current state and the initial state of a data item are maintained.

You could achieve the desired behavior by binding the Grid to local data - the Grid datasource will be synchronized with this data automatically, while remote synchronization will be done at your own discretion.

http://demos.kendoui.com/web/grid/local-data.html

CRUD operations with local data can be managed with functions defined in the transport (instead of URLs)

http://docs.kendoui.com/api/framework/datasource#configuration-transport.update

Regards,
Dimo
Telerik

[Lynx IT]

Hi Dimo, thanks for your help.

In the end, we managed to get this working using CRUD functions, based closely on the jsFiddle in the following thread:
http://www.kendoui.com/forums/kendo-ui-framework/data-source/canceling-popup-editor-removes-row-in-grid.aspx

I believe our situation was somewhat unique, as we are using both the schema.data property, along with local data.
I am somewhat suspicious that this configuration has a bug.

To reproduce the issue we were experiencing, follow the brief instructions I've left in this fiddle.

In Kendo UI Web v2013.3.1119, line 8338, in the DataSource _accept method:

response = that.reader.data(response)

This line results in response becoming an empty array, while the data array actually contains elements.
Later in the function, when the below code runs, we end up with pristine being an array whose length is the same as data, but all of its items are undefined.

if (type === "create") {
  pristine.push(serverGroup ? wrapInEmptyGroup(that.group(), models[idx]) : response[idx]);
} else if (type === "update") {

The updated jsFiddle that we've used to fix our issue can be found here.
This works because when a record is being created, we're smuggling the actual model data through a property which matches the schema's data property.

I hope this isn't too convoluted. I've done a number of different tests using different combinations of actions, to try to break things with this "fix" in place, and it consistently produces the behaviour we expect.

[Dimo]

Hi Joseph,

You seem to be using a very old Kendo UI version. The described scenario works with the latest version.

Regards,
Dimo
Telerik