sapui5 smarttable stick property

Question

I have a requirement to have a fixed columnheader for a smarttable. On the xml view i add <Table sticky="ColumnHeaders" />inside the smart table. This is working file if i test the application from Webide (sapui5 version 1.60 ). Through chrome developers tools-> inspect element i see that extra css classes sapMSticky and sapMSticky4 are added to the table element.

But the backend is based on sapui5 version1.52 ( sticky property is not supported from 1.54 ), and i can't see the properties of the css class through the chrome developers tools. My question is how to solve this ?

Thanks in advance,

Answer 1

I don't think there's a way to solve it. There's not only a problem of missing CSS but I also think about missing implementation.

The only way to solve your issue is to upgrade the SAPUI5/OpenUI5 version on your backend system if you want to use it natively. Otherwise, you can implement it on your own with two tables, one hidden and one not but it's really tricky and not a very clean solution.

Answer 2

If you can't upgrade UI5, you have to use a workaround:

To make header elements always stay on top, you first construct a List/Table just with top elements but without data and the property showNoData set to false. Then you construct another List/Table without those top elements and take it as content for a sap.m.ScrollContainer with the height property set to some percentage value. If you add both the List without data and the ScrollContainer to the main content, you get something like a sticky header.