Hi,
We have used IgGrid and igHierarchical grid with virtualization in our project, we are encountering UI issue when there is minimal number of records.
i.e say the grid size is some 500px and when we bind data which has only one row, then the row length is getting set/expanded to the available height of the grid.
Thanks,
Kiran
Hello Kiran!
Thank you for the provided sample!
You can resize the grid when data is rendered. To do so you can use the dataRendered event and then all rows using the allRows method and multiply it by avgRowHeight and sum it with grid headers an set the result to be new grid height. You can get grid headers height by using the ui-widget-header class.
1 dataRendered: function(evt, ui) { 2 var rowsCount = $grid.igGrid('allRows').length; 3 var avgRowHeight = parseInt($grid.igGrid('option', 'avgRowHeight')); 4 var totalRowsInHeight = rowsCount * avgRowHeight; 5 var $gridHeader = $('.ui-widget-header'); 6 var gridNewHeight = $gridHeader.height() + totalRowsInHeight + 4; 7 $grid.igGrid('option', { 'height': gridNewHeight }); 8 }
You can also review the attached sample bellow.
If you have any additional questions, please let me know.
Hello Denis,
Thanks for above code snippet it works as expected.
But in my case I need the grid height to remain constant and not change based on the number of rows in the grid. Is there a way not to change the grid height but recalculate the row heights and change it.