SAP UI5 - Table Row shift / Expand

[former_member254395]

Overview:

I have seen quite few of posts and queries around shift the sap.m.table. I also came across few requirements similar to this.

So just tried few options with sap.m.table and sharing my experience of table show shift here.

Business Requirement:

I am developing a custom Fiori application for Manage Contract. As customer wanted to have mass approve /rejection of contracts, wherein he should able to select/deselect contacts and line items from single screen.

Basically it will provide option to view contact and its items along with critical details to take actions.

Note/caution:

I am using this application only on desktop, while you trying to use same case on productive purpose make sure the responsiveness and different form factors were tested and taken care at your application level to in line with sap design guidelines as well.

Sample Application:

I have a parent table to display the list of contacts, were user call click on icon to view the item details as below.



Row shift:



Implementation:

I maintained and column with max screen size greater than desktop (ex minScreenWidth="1370px") and made the column invisible and made visible while user clicks on the icon … very simple J …

 



Also in controller,



Also find the full example on github as well.

 

Summary:

This will provide few options and allow fellow developers to generate more ideas and solve few of them critical development use cases as well.

Please make sure the responsiveness and UI adoption based on devices at your own risk J .