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

Populating multiple sub-grids with one datasource

1 Answer 235 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Bryan
Top achievements
Rank 1
Bryan asked on 04 Oct 2017, 07:04 PM

Hi,

I am using a grid that initially only pulls the most commonly used data fields for each record in the grid (what I call level 1).  Optionally, the user can expand a given row, in which case additional details are displayed in a nested grid, which I call level2.  This works fine when a single row is expanded. 

I have a method for the user to expand all of the rows currently displayed in the level1 grid.  When this occurs, a call is made to the server for each row that is being expanded in order to pull the additional details for the level2 grid for each row.  This is a very slow operation when I am displaying a large number of rows in the level1 grid (for example, 100 rows).

I am wondering if it is possible to query the data for all of the rows to be expanded in a single call to the server and then use the resulting data set to populate all of the level2 grids without having to make n round trips to the server for one record at a time. Querying and returning the data for all rows is not a problem.  But since each level2 grid is a separate object, I am not sure how to point them all to the appropriate data on the client side, or if it is even possible.

Or is there a better approach to populating multiple level2 grids that would perform well?

Thanks!

1 Answer, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 06 Oct 2017, 10:56 AM
Hello, Bryan,

In this scenario, the slow performance is most probably caused by rendering 100 Grid almost at the same time and event optimizing the request will still be significantly slower.

The described result is expected because by expanding all parent rows this is initializing another 100 Grids on the page which is very resource consuming operation and it will mainly depend on the browser and the machine.

In this scenario, we can suggest to either reduce the page size of the main Grid to a number where the performance is acceptable or to expand the first couple of child Grids:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-pageSize

Another option will be to implement our new Endless scrolling feature, but please check all of its specifics as some of them may not be acceptable:

http://docs.telerik.com/kendo-ui/controls/data-management/grid/appearance#endless-scrolling

I do understand that this may not be the perfect solution, but rendering 100 Grids simultaneously on the page is a very heavy task for almost all of the standard computers.

Regards,
Stefan
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.
Tags
Grid
Asked by
Bryan
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Share this question
or