1

I am using clr-datagrid. After datagrid is drawed, the height of datagrid is fixed and never changed. I think there is some logics to calculate the height according to the number of rows.

I also use expandable rows, when I expand some rows, I expected the whole datagrid height is expanded so that the rows aren't cut.

I overrided the class 'datagrid-host'. I deleted the display property of the class. after that, even though the height is fixed, I don't see the row's cut anymore. but I don't think this is the right way to control the height of datagrid.

<clr-datagrid _ngcontent-xhi-c1="" ng-reflect-selected="" ng-reflect-row-selection-mode-deprecated="false" class="datagrid-host" **style="height: 3683px;"**>
....
</clr-datagrid>

this height is presented after few secs.. I want to know where the height is calculated..

jihye
  • 11
  • 1
  • Datagrid height is set when there is pagination. This is to keep the height consistent when the user reaches the last page. If you are not using pagination can you post an https://stackblitz.com/@clr-team with a reproduction for your issue. It helps to have a working application to look at so I can understand what is going on. – hippeelee Aug 27 '19 at 05:40
  • ah, yes I am using pagination. then how can I have dynamic height of datagrid? I can't remove the fixed height even though i use pagination? – jihye Aug 29 '19 at 02:17
  • 1
    Datagrid was initially released with a flexible height and early user feedback on the paginated datagrid a was that the resize that happens when paging to the last page was a jarring UX. We added the height calculation to prevent the page resize for that use case. – hippeelee Aug 29 '19 at 02:20
  • You might be able to override the height with css but I haven’t tried to make that work myself. – hippeelee Aug 29 '19 at 02:20
  • I tried to change a class named 'datagrid-host'. The display property initially was set as 'flex'. I change this property to 'block'. Then I can use this datagrid with flexible height, I just wonder this is the right way.. I will post later again if I find some error on the datagrid. – jihye Aug 29 '19 at 05:20
  • Css on the app side is one way. Be careful though - the datagrid relies and a very complicated flexbox for laying out all of the pieces. Removing it from one level could have an effect on one of the child components in there. Ping here if you have specific questions. If you can create a simple stackblitz reproduction of your code it will be easier to help. – hippeelee Aug 30 '19 at 00:28

0 Answers0