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

11 posts, 0 answers
  1. Plamen
    Plamen avatar
    3 posts
    Member since:
    Jul 2017

    Posted 19 Sep 2017 Link to this post

    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>


  2.
  3. Georgi
    Admin
    Georgi avatar
    698 posts

    Posted 21 Sep 2017 Link to this post

    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.
  5. stim
    stim avatar
    2 posts
    Member since:
    Apr 2019

    Posted 24 Mar 2020 in reply to Georgi Link to this post

    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

  7. Georgi
    Admin
    Georgi avatar
    698 posts

    Posted 26 Mar 2020 Link to this post

    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.
  8.
  9. stim
    stim avatar
    2 posts
    Member since:
    Apr 2019

    Posted 26 Mar 2020 in reply to Georgi Link to this post

    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

  11. Plamen
    Plamen avatar
    3 posts
    Member since:
    Jul 2017

    Posted 26 Mar 2020 in reply to Georgi Link to this post

    Georgi,

    I am sorry I did not respond here earlier.

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

    Thank you!

  13. Georgi
    Admin
    Georgi avatar
    698 posts

    Posted 30 Mar 2020 Link to this post

    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.
  14.
  15. Tony
    Tony avatar
    3 posts
    Member since:
    Aug 2020

    Posted 22 Sep 2020 in reply to Georgi Link to this post

    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
  17. Georgi
    Admin
    Georgi avatar
    698 posts

    Posted 23 Sep 2020 Link to this post

    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).

  19. Tony
    Tony avatar
    3 posts
    Member since:
    Aug 2020

    Posted 23 Sep 2020 in reply to Georgi Link to this post

    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

  20.
  21. Georgi
    Admin
    Georgi avatar
    698 posts

    Posted 25 Sep 2020 Link to this post

    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/.

Back to Top