Set number of rows in wijmo flexgrid

Set number of rows in wijmo flexgrid

Posted by: nilesh_nichal on 31 December 2018, 6:20 am EST

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 31 December 2018, 6:20 am EST

  Hi,

  I want to limit the number of rows a flexgrid can show. Could you please provide any solution or way to set number of rows a grid can show

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 2 January 2019, 12:48 am EST

  Hi,

  You may set the pageSize of the underlying collectionView to limit the no of rows shown in FlexGrid.
  
  Please refer to the following code snippet:

  gridInstance.collectionView.pageSize = 20;
  

  You may also refer to the following sample demonstrating the same: https://stackblitz.com/edit/angular-e3ckom?file=app%2Fapp.component.html

  ~Sharad

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 2 January 2019, 5:42 am EST

  I am using nested grids(child grid inside the column of parent grid), In that case this pagesize property is not getting applied to any of those.
  
  It it necessary to use paging for limiting the rows in the grid.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 3 January 2019, 1:03 am EST

  If we understand correctly, then you are using ‘wj-flex-grid-detail’ to show a nested grid inside the main grid. In that case, pageSize won’t work since detail rows are part of the source collection.
  
  You may also limit the no of rows by hiding the excessive rows using the visible property of the GridRow.
  
  Could you please explain some more about your use case so that we may suggest you the best possible solution

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 3 January 2019, 7:07 am EST - Updated 3 October 2022, 8:14 pm EST

  I am using flex-grid inside other flex-grid.(there is no flex-grid-details in our code). We are using same item source for both grids. In inner grid the there is huge data, we are showing it on another popup so I have to limit the number of inner-grid rows to 3 and shoe remaining data on popup.

  We are showing grid as follows:
  
  

  

  1366×768 13.7 KB

  Currently we have set height to the grid so it is showing scroll, We don’t need a scroll in that grid and have to limit rows to 3. Could you please help out in this

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 4 January 2019, 12:56 am EST

  In this case, you may set the pageSize for the collectionView of the inner grid.
  
  Please refer to the following sample: https://stackblitz.com/edit/angular-ydapd4?file=app%2Fapp.component.ts