Skip to Content
Feb 03, 2021 at 05:44 AM

Fiori Elements dynamically change fiori smart filter bar filter values


I am trying to dynamically change a multicombobox filter value using logic in an extension controller. There are two multicombobox filters in a smart filter bar in a fiori app. One is department, the other is team. The requirement is when a user selects a value in the team multicombobox, remove any selections in the department multicombobox. I do this successfully by attaching a selection change event to the team multicombobox, then trigger logic to remove the deparment multiplecombobox as follows.

return sap.ui.controller('noentry.ext.controller.ListReportExt', {
  async onInitSmartFilterBarExtension(event) {
    const filterBar = event.getSource();
    const teamComboBox = filterBar.getControlByKey('teamID');

  _onTeamChange(oEvent) {
    const filterBar = oEvent.getSource().getParent().getParent().getParent();
    const departmentComboBox = filterBar.getControlByKey('departmentID');

This logic works perfectly for removing the department multicombobox values, however, it does not update the filter query that is used. It continues to use the department filter that was removed. In addition, the "Adapt Filters" dialogue continues to hold the previous department value selections.

Before logic is applied:

After logic is applied (note the department multicombox value has cleared, however the "Adapt Filters" still has it):

It seems there is a binding that needs to be updated between the multicombobox filters and the filters binding used for the query. Is there some way to manually trigger an update to the filter binding, so that the multicombobox filter values that were changed through this custom controller logic will be reflected in the query filter as well? I have started down the path of manually updating the query filters through more custom controller logic, but it is turning into a very clunky solution. I appreciate any help or guidance.




image-1.png (14.9 kB)
image-2.png (13.9 kB)