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!
cancel
Showing results for 
Search instead for 
Did you mean: 
0 Kudos
2,737
In SAPUI5 we have 2 controls for table (i) sap.ui.table.Table (ii) sap.m.Table

Currently we have default feature that will allow us to sort and filter. But Multi filter option like that we have got in Excel is missing. Below picture shows Sorting (Ascending/Descending) and Filter option

  

                                                             

In order to achieve Multi Filter Excel-like feature I have extended Table UI control and on click of header column it will bring a popup that has multi filter option.

Below is few of the snap shot that works for Multi-Filter on Table UI control:

 



Sample Code is available in github

https://github.com/jenishprabhu/TableExtend

 

Code Explained:

STEP1: Table is extended in tableUIExt.js

STEP2: Click event is attached to the table column cell

sap.ui.table.Table.prototype.onAfterRendering.apply(this, arguments);
var count = 0;
this.$().find('.sapUiTableColCell').each(function() {
colClick(count++, $(this));
});

STEP3: custom columnPress event is fired on click of header

col.click(function() {
that.fireColumnPress({'columnIndex': idx, 'event': this});
});

STEP4: ColumnClickableTable is instantiated

 

var oTable1 = new ColumnClickableTable("Table2", {

.

.

}

STEP5: columnPress event is triggered

STEP6: popOver is opened by attaching this event
Labels in this area