We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Re-render collapses child grid

I want to perform a heavy request every time i expand a row, then fill child grid with data from the response.

How to keep the rows of child grid expanded when requesting data with detailDataBound callback?


https://stackblitz.com/edit/react-n1rnfi-fehxah?file=index.js



3 Replies

JC Joseph Christ Nithin Issack Syncfusion Team October 20, 2022 01:04 PM

Hi Filipp,


  Greetings from Syncfusion support.


  Before proceeding with the solution, we would like to inform you that the sample provided is not runnable and we would also like you to share the following details so that we will be able to proceed further.


  • Please explain the exact issue you are facing in detail.
  • Please share a runnable sample to validate the issue you are facing.
  • Please share a video demo for the issue.
  • Please share the replication procedure of the issue you are facing.


Please get back to us for further details.


Regards,

Joseph I.



FI Filipp October 21, 2022 04:26 AM

Hello, Joseph.

  1. Rows are being collapsed when child grid is expanded
  2. The sample is runnable (cant attach video (mp4 is not an allowed extension), so i uploaded it to mega
  3. To replicate the procedure, expand child grid, request data with detailDataBound callback and update child grid with the data received.
So im looking for the way to keep the rows expanded. 


RS Rajapandiyan Settu Syncfusion Team October 24, 2022 06:00 AM

Hi Filipp,


Thanks for your update.


By default, updating the state variable will refresh the react component. So, we suggest you to bind the childGrid dataSource from the event argument. Find the below code for your reference.



  const detailDataBound = (args) => {

    args.childGrid.dataSource = result.entries;

  };

 


Regards,

Rajapandiyan S
If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Loader.
Live Chat Icon For mobile
Up arrow icon