This topic contains 24 replies, has 3 voices, and was last updated by  Manish Gupta 2 weeks, 2 days ago.

Viewing 15 posts - 1 through 15 (of 25 total)
  • Author
    Posts
  • #100399

    razam
    Member

    Hi,

    I am trying to mimic the ODataVirtialCollectiomView and load data as I scroll. I have rows that have children and want to display them when I click on expand. The children are loaded along with the parent rows. I have the data loading virtually as I scroll, but dynamic loading stops working. I get only the initial data showing after which the scrolling callback isn’t called. Is there something I am missing or need to do to make this work?

    I am trying to evaluate different grids for usage with react js and this is a very important feature for us before we decide to purchase. Can someone help?

    Thanks in advance.

    #100400

    razam
    Member

    I forgot to mention that I get an exception in the console stating the ‘children’ of undefined cannot be retrieved. This exception is seen as soon as the page is loaded.

    #100405

    razam
    Member

    Uncaught TypeError: Cannot read property ‘children’ of undefined
    at u._addNode (wijmo.grid.min.js:13)
    at u._bindRows (wijmo.grid.min.js:13)
    at wijmo.grid.min.js:13
    at i.r.deferUpdate (wijmo.min.js:13)
    at wijmo.grid.min.js:13
    at u.t.deferUpdate (wijmo.min.js:13)
    at u._bindGrid (wijmo.grid.min.js:13)
    at u.set [as itemsSource] (wijmo.grid.min.js:13)

    #100406

    razam
    Member

    I believe I have found the issue, but will need help fixing it. When I scroll rows off screen/ out of the viewport, I am removing the items from the underlying items source. As a result, the above exception is raised as the binding it being updated for a removed row. Can I fix this somehow without storing objects in memory and without subclassing FlexGrid?

    #100415

    Abhishek Dutta
    Moderator

    Hi,

    Could you please try clearing out the itemsRemoved object of the CollectionView when items are being removed from the Underlying source and let me know if it helps. If you are still facing the issue then please send across a small sample and we will investigate this in further detail.

     this.data = new wjCore.CollectionView(somedata);
     this.data.itemsRemoved.clear()

    Thanks,
    Abhishek

    #100432

    razam
    Member

    Answer

    Hi,

    I just tried this, but unfortunately, I am still getting the same error:

    Uncaught TypeError: Cannot read property ‘children’ of undefined
    at u._addNode (wijmo.grid.min.js:13)
    at u._bindRows (wijmo.grid.min.js:13)
    at wijmo.grid.min.js:13
    at i.r.deferUpdate (wijmo.min.js:13)
    at wijmo.grid.min.js:13
    at u.t.deferUpdate (wijmo.min.js:13)
    at u._bindGrid (wijmo.grid.min.js:13)
    at u.set [as itemsSource] (wijmo.grid.min.js:13)
    at Object.Blotter.onGridReady [as initialized] (Blotter.tsx:138)
    at i (wijmo.react.min.js:13)

    My code is attached. Please advise.

    #100433

    razam
    Member

    Trying to upload again.

    Attachments:
    1. Archive.zip
    #100465

    Abhishek Dutta
    Moderator

    Hi,

    We are looking into it. We will get back to you on this soon.

    Thanks,
    Abhishek

    #100466

    Abhishek Dutta
    Moderator

    Hi,

    We are looking into it. We will get back to you on this soon.

    Thanks,
    Abhishek

    #100518

    Manish Gupta
    Moderator

    Wijmo Subscriber

    Hi Razam,
    Please try to replace Detail Grid sourceCollection instead of clearing this. For reference, please see the attached sample that implements the same.

    If it does not work, could you please confirm that our understanding is correct or not so that we can assist you accordingly?
    As per our understanding, you are loading data virtually using ODataVirtualCollectionView that is fine and has no issue, now you would like to display different data in child FlexGrid for rows based on some condition.

    Could you please elaborate what did you mean for ‘Dynamic Loading’ and how you would like to load data for child rows?

    Thanks ,
    Manish Kumar Gupta

    #100522

    razam
    Member

    Hi Manish,

    I am loading data as I scroll through the grid. I do not want to keep all this data in memory, so I delete it from the source collection when it is no longer in view (I do not just null it out). When I load the data, the parent and child row data are loaded at the same time. So, we do not need to lazy load child rows – only parent rows. The parent row either has child rows or it does not. There is no other condition.

    Right now, I generate 50 rows (some with child rows, some without) – 30 are in view while I keep 10 above and 10 below as buffer. As soon as the data is loaded into the grid, I get the above exception. As a result, when I scroll to the bottom, the scroll event isn’t raised and I cannot load more rows. It seems like setting child items path excepts all parent rows to be loaded into memory. Is this true? If so, can we somehow break this requirement? Or, can I defer children binding or manually bind the child rows? This is the only hurdle we have right now. We want to virtualize scrolling, which FlexGrid already does; and we want to show child rows (if parents have any), which FlexGrid already does. However, doing both seems to break the grid.

    I will try the sample and post back.

    Thank you,
    Rehan

    P.S. I know due to timezone differences, there is a day delay in getting a response. Is it possible to get replies on the same day? We are constrained by time and need to select a grid quickly.

    #100523

    razam
    Member

    We are using React, not Angular. Is there a FlexGridDetail control available for React?

    #100600

    Manish Gupta
    Moderator

    Wijmo Subscriber

    Hello,
    FlexGridDetailProvider is a class and can use simply using FlexGrid reference object. You can refer to documentation for more info.

    If possible, could you please provide a sample depicting your issue so that our team can debug and can assist you accordingly.

    Thanks,
    Manish Kumar Gupta

    • This reply was modified 1 month, 1 week ago by  Manish Gupta.
    #100672

    razam
    Member

    Hi,

    Thank you for the reply. I have the detail grid coming up now. I was wondering though, can I use JSX in the createDetailCell function?

    I’d rather not have to do: var cell = document.createElement(‘div’);

    Thank you.

    #100713

    razam
    Member

    Also, although FlexGridDetailProvider works, why doesn’t setting childItemsPath work? Does the grid require all data to be in memory for childItemsPath to be used for displaying hierarchical data?

Viewing 15 posts - 1 through 15 (of 25 total)

You must be logged in to reply to this topic.