Fiori Elements List Report Searching and Filtering Data

The list report supports two ways of searching and filtering:

Search Field

  • Find a keyword in multiple fields
  • support fuzzy search
  • no value help dialog

Selection Field

  • 1..1 relationship between selection field and OData properties. It performs filter on a property of backend OData service.
  • value help dialog can be used to search data

For fields without a fuzzy search function, users must input the exact same keyword as the data along with wildcard characters ( * and ? ) to match data.

For fields with a fuzzy search function, if a user enters a typo in their keyword, similar results appears.

@Search.searchable: true to add a search field for a list report. @Search.defaultSearchElement: true At least one field should be set as default search element. More than one field can be set as default search element.

Add property fuzzinessThreshold, if a field needs a fuzzy search function.

@AbapCatalog.sqlViewName: 'ZAMARMNFE1'
@UI.headerInfo: {
    typeName: 'Sales Order',
    typeNamePlural: 'Sales Orders',

    title: {
        value: 'SalesOrderID'
    }
}
@EndUserText.label: 'ZAMARMN_FE1'
@Search.searchable: true
@OData.publish: true
define view ZAMARMN_FE1
  as select from SEPM_I_SalesOrder
{
      @UI.lineItem: [{position: 10 }]
  key SalesOrder                                                    as SalesOrderID,
      @UI.lineItem: [{position: 20 }]
      _Customer.BusinessPartner                                     as CustomerID,
      @UI.lineItem: [{position: 30 }]
      @Search: {
          defaultSearchElement: true,
          fuzzinessThreshold: 0.5
      }
      _Customer.CompanyName                                         as CustomerName,
      @UI.lineItem: [{position: 40 }]
      @Search: {
          defaultSearchElement: true
      }
      _Customer.EmailAddress as CustomerEmailAddress,
      @UI.lineItem: [{position: 50, importance: #MEDIUM }]
      @UI.hidden: true
      GrossAmountInTransacCurrency                                  as GrossAmount,
      @UI.lineItem: [{position: 60, label: 'Tax Amount', importance: #LOW }]
      @Semantics.amount.currencyCode: 'Currency'
      GrossAmountInTransacCurrency - NetAmountInTransactionCurrency as TaxAmount,
      @Semantics.currencyCode: true
      TransactionCurrency                                           as Currency
}

Selection Field Search filed with value help button

@UI.selectionField.position to declare a field as selection field as well as its position.

Even fields that do not display as a column can be used as a filter condition.

...
define view ZAMARMN_FE1
  as select from SEPM_I_SalesOrder
{
      @UI.lineItem: [{position: 10 }]
  key SalesOrder                                                    as SalesOrderID,
      @UI.lineItem: [{position: 20 }]
      @UI.selectionField: [{position: 10 }]
      _Customer.BusinessPartner                                     as CustomerID,
...