This is a migrated thread and some comments may be shown as answers.

Kendo UI kendo ui grid row disappears from the grid when cancel editing

10 Answers 1686 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Plamen
Top achievements
Rank 1
Plamen asked on 19 Sep 2017, 08:27 PM

I have the following problem:
I have a kendoUI grid and I execute the following steps:

1. I add a row to the grid.

2. I click "Edit"

3. I click "Cancel"

The row disappears.

 

<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { command: ["destroy", "edit"]}
  ],
  dataSource: {

    schema: {
      model: { id: "id" },
      fields: {
              id: {type: "number"},
            name:  { type: "string", editable : true},
               }
    }, 
  },
  editable: {
    mode: "inline"
  }, 
   toolbar:[ "create"],
});
</script>


10 Answers, 1 is accepted

Sort by
0
Georgi
Telerik team
answered on 21 Sep 2017, 12:51 PM
Hi Plamen,

I have answered your inquiry in the support ticket. However, I will post the answer here as well in case someone from the community has the same issue.

===

Thank you for the provided code. The observed behavior is expected since id is key word for Kendo. For each data item an internal object in the data source is created. These objects extend the data objects passed to the grid. Since the internal objects also have id property, that property gets overridden by the values of the data objects.

Also clicking cancel executes the cancelChanges method. In other words all items with default identifiers are considered not saved and they get removed. So when creating item and the grid is bound to local data, an id have to be defined.

I have modified the provided code and now the Kendo Grid works as expected:


===

As a side note, we monitor both the forums and the ticketing system. Please avoid submitting duplicate threads. That will enable us to keep better track of the support history and provide better service.


Regards,
Georgi
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
stim
Top achievements
Rank 1
answered on 24 Mar 2020, 09:11 AM

Georgi,

One step more and your example doesn't work! Just do the following on an existing record:

1) Edit.

2) Change personId.

3) Update.

4) Edit.

5) Cancel.

Regards,
gz

0
Georgi
Telerik team
answered on 26 Mar 2020, 09:08 AM

Hello Stim,

You are correct, the  behavior occurs when you modify the identifier. However, this is not quite a valid scenario as the user should not be able to modify the id field. Allowing it might cause more serious trouble.

Could you please share a bit more details on your case? Why is it necessary to allow the users to modify the ids of the items?

Regards,
Georgi
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
stim
Top achievements
Rank 1
answered on 26 Mar 2020, 11:38 AM

The ID field determines a meaningful and changeable order of the items. We cannot easily modify the affected database tables to introduce, say, some surrogate IDs and the OrderNo fields because another application relies on the current schema (it's a legacy system).

Regards,

gz

0
Plamen
Top achievements
Rank 1
answered on 26 Mar 2020, 12:24 PM

Georgi,

I am sorry I did not respond here earlier.

The id fixed it. Have been using it ever since!

Thank you!

0
Georgi
Telerik team
answered on 30 Mar 2020, 10:14 AM

Hi Gz,

How do you handle updates for items which have their id modified? How do you map the sent object to the actual database item if the id field is no longer the same? Do you have another identifier field?

Regards,
Georgi
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Tony
Top achievements
Rank 1
answered on 22 Sep 2020, 04:51 PM
Hey Georgi, I'm not sure I fully understand the functionality. I'm working on the inline editing, but the way it is set up right now, if a user accidently edits the wrong record and hits cancel, that record disappears. Not optimal and not good for the user to see records disappear. It seems more like a bug. Looking forward to the help, thanks
0
Georgi
Telerik team
answered on 23 Sep 2020, 10:07 AM

Hello Tony,

Would it be possible to share your configuration with us?

Clicking should not remove the edited item. Please check our demo where the item is not removed after clicking cancel:

Could you please make sure you have specified the dataSource.schema.model.id setting?

Regards,
Georgi
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

0
Tony
Top achievements
Rank 1
answered on 23 Sep 2020, 06:12 PM

Thanks Georgi!

That seemed to fix the issue I was having. I didnt have the dataSource.schema.model.id. Out of curiosity, why does the component require that for it to work properly.

Thank you,

Tony

0
Georgi
Telerik team
answered on 25 Sep 2020, 12:03 PM

Hi Tony,

The dataSource uses the id of the model to track its status. Internally we create a map which indicates the state of each item whether it is new, modified or saved. Without the any identification we are not capable of building this map, thus tracking the items is not possible.

Regards,
Georgi
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Plamen
Top achievements
Rank 1
Answers by
Georgi
Telerik team
stim
Top achievements
Rank 1
Plamen
Top achievements
Rank 1
Tony
Top achievements
Rank 1
Share this question
or