Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
Showing results for 
Search instead for 
Did you mean: 
Hello everyone,

This is my very first post on SAP Community.

Recently, I need to have a column show/hide feature for a report using sap.ui.table.Table. The report is using JSON model since I need to join all data retrieving from oData services and i don't have a view either.

I've explored some options:

  1. Element sap.ui.table.Table has a property showColumnVisibilityMenu which is false as default. It's good but I can't select multiple column to hide at same time. Each time, I can only choose one.

  2. I have a simple way. I create a fragment with SelectDialog binding JSON model and handle hide/show by setting the property visible true/false. This meets my requirement.

  3. But I want to see if SAPUI5 provides any elements like this. I find out that the smart table has the feature but it only works with oData. Finally I find this element from library sap.m: However, I can't find one sample for sap.ui.table.Table. I try to do one.

First, I use the sample code from SAPUI5 website:

Second, I borrow the file DemoPersoService.js from sap.m.sample.TablePerso above which will be used as Personalization Service object when initiating TablePersoController object. I replace resetPersData function  with delPersData.

Third, I add some codes in Component.js, and the controller. I remove some columns to keep the demo simple.

Component.js: DemoPersoService.js added

The controller:

Finally, the result will be like this. With element sap.ui.table.TablePersoController, we can hide/show multiple columns at same time and sort columns as well. You can check this by yourself by clicking the up/down arrow.

You can clone my git to play around with the demo.

Thank you for your time.
Labels in this area