Kendo UI Grid with offline storage and custom schema record disappearing

15 posts, 0 answers
  1. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 06 Dec 2017 Link to this post

    The record is removed when cancelling the edit of a new record.

    JSFiddle: http://dojo.telerik.com/adAZa

    Steps:
    1. Click Add new Record
    2. Click Update
    3. Click Edit
    4. Click Cancel

    Record is Gone.

    Click Refresh

    Record is back!
  2. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 08 Dec 2017 Link to this post

    Hello, Michel,

    Thank you for the example.

    The issue occurs because there is no update transport defined in the Grid and the update is not actually made. That is why when the cancel button is clicked this is calling cancel changes and it is removing all of the unsafe changes.

    Noticed that this is not observed in our demo where there is a transport update setup:

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

    https://docs.telerik.com/kendo-ui/framework/datasource/offline

    Please let me know if you need additional information on this matter.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 11 Dec 2017 in reply to Stefan Link to this post

    The grid is off-line, no update should happen.

    The bug is using off-line mode with custom schema config.

  4. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 11 Dec 2017 in reply to Stefan Link to this post

    The grid is off-line, no update should happen.

    The bug is using off-line mode with custom schema config.

  5. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 13 Dec 2017 Link to this post

    Hello, Michel,

    Please advise which is the expected result in this scenario?

    When the dataSource is in offline mode, it will save all of the changes in the local storage and it will make the update once the dataSource is again in online mode.

    As for the schema, the issue occurs because the data is the response, and setting the schema.data to "data" will force the Grid to look for its data in response.data which is empty. The same is applicable for schema.total, schema.groups and schema.aggregates:

    http://dojo.telerik.com/adAZa/5

    https://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.data

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  6. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 13 Dec 2017 in reply to Stefan Link to this post

    As for the schema, the issue occurs because the data is the response, and setting the schema.data to "data" will force the Grid to look for its data in response.data which is empty.

    The grid is offline. No response or its data in response should be expected. It should have data in response when it becomes online again.

    The expected result is to save the data on the offline storage normally, even with a custom schema.

     

     

  7. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 14 Dec 2017 Link to this post

    Hello, Michel,

    Even if the Grid is in offline mode a response is still expected, it is just received from the local storage.

    In this case, we recommend using a function for the schema.data and the others schema options as this will allow checking if the Grid is in offline mode. Then the function should return a response, and in online mode to return response.data:

    http://dojo.telerik.com/adAZa/6


    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  8. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 14 Dec 2017 in reply to Stefan Link to this post

    My datasource has a transport, not a function.

    Even if the Grid is in offline mode a response is still expected, it is just received from the local storage.

    No response exists if the grid is offline, it is just nonsense.

    And the bug still exists even if I store it respecting the schema. Notice that, after the record disappearing, it nows appears when you click refresh on the grid, which means that it is now being stored and retrieved correctly. The bug is on your side, I believe you are checking the record as new, even when editing a newly inserted record (which is wrong), and removing it from the view on cancel edit.

    - cancel new should remove from view - working as expected;

    - cancel edit shouldn't remove from view - not working even after hitting refresh;

    - cancel "edit new"  shouldn't remove from view - not working.

    http://dojo.telerik.com/ijOSU

    It should work offline, without acrobatic manuevers.

  9. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 18 Dec 2017 Link to this post

    Hello, Michel,

    I have consulted with the developers' team and I can confirm that the described result is expected.

    I will try to provide a more descriptive explanation of why this is happening.

    When the Grid is using the "offline" mode it uses the browser local storage as an improvised data storage to which the new data should be sent and from where the data should be retrieved. It may look strange at first that the Grid is in offline mode, but it is still making requests, but this is how the offline functionality is working.

    In the discussed scenario, the data received from the local storage is located inside the response variable directly which is causing the clearing of the data, as it is not finding any data in the response.data variable.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  10. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 18 Dec 2017 in reply to Stefan Link to this post

    I don't think you checked my last dojo, on my last response, when I updated using a custom storage.

    http://dojo.telerik.com/ijOSU

    In the discussed scenario, the data received from the local storage is located inside the response variable directly which is causing the clearing of the data, as it is not finding any data in the response.data variable.

    Again not working as expected. Notice that in the last dojo, I put the data on the local storage respecting the schema (response.data):

    sessionStorage.setItem('session-kendo-demo', JSON.stringify({data: item}));

    Quoting myself:

    Notice that, after the record disappearing, it nows appears when you click refresh on the grid, which means that it is now being stored and retrieved correctly.

    So, it is working as expected only when reading data from the storage. When the record disappears, the storage's getItem method isn't even called.

    Again, it is clearly a bug.

  11. Preslav
    Admin
    Preslav avatar
    455 posts

    Posted 20 Dec 2017 Link to this post

    Hello Michel,

    In the provided Dojo, as you put the data in the "data" object, it is located there. That said, I am not sure what is the issue, thus, please elaborate.

    With the above said, I created a short video demonstrating that in the local/session storage the data is inside the "data" object:


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  12. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 09 Jan Link to this post

    Sorry, I was out of office.

    The data *is* persisted. the issue isn't about persisting the local data. Is about cancelling a newly inserted row. Using the following dojo:

    http://dojo.telerik.com/ijOSU

    1. Click 'Add New Record'

    2. On the new record row, put 'Some Product' as the new name and '10' as the value.

    3. Click Update

    4. Click on 'Edit' on the only Record.

    5. Now click in Cancel.

    6. The record disappears from the grid (BUG!).

    ====

    Note that the record is persisted. After the steps are done, try clicking refresh. It reads from the storage, respecting the schema.

    Repeat the steps 4-6 again. The same bug happens.

     

     

  13. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 11 Jan Link to this post

    Hello, Michel,

    Thank you for the example and the steps.

    As described this occurs because the custom schema is telling the Grid to search for its data in response.data, but the local storage is returning directly the data(response). If the schema is set as a function to parse response depending on the dataSource mode the example is working as expecting:

    http://dojo.telerik.com/ijOSU/6

    This is the expected result based on the implementation and if you consider this unexpected please submit a feature request as changing it without the approval from the community will cause a breaking change for all of the users which are using it as intended:

    http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback/filters/new?category_id=63716

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  14. Michel
    Michel avatar
    8 posts
    Member since:
    Dec 2017

    Posted 11 Jan in reply to Stefan Link to this post

    Your solution works when the grid has no transport.

    In my case, the real grid has a transport (which I cann't put public, and I don't have a simple sample) with a custom schema.

    The "data" function isn't called in that case.

    This is a show-stopper. The grid isn't reliable when used offline *and* with a custom schema. The record 'll still disappears from the grid. I cann't approve the purchase of the component with this feature broken.

    If you can, repeat the test case using both:

    - A custom schema

    - A transport.

    I hope that I can make you understand the issue.

  15. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 15 Jan Link to this post

    Hello, Michel,

    I'm sorry to hear that this is a show-stopper for using the Grid. If we receive an example reproducing the full issue we will be able to log it and fix it or advise if something in the configuration has to be changed.

    I made an example with transport and the schema.data was called as expected:

    http://dojo.telerik.com/odAxe

    Thank you for collaborating with us on locating a possible issue with the Kendo UI Grid.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top