Saving values in custom smart filter field

Question

In this smart filter example: https://sapui5.hana.ondemand.com/#/sample/sap.ui.comp.sample.smartfilterbar.example2/preview

.. a custom field is used. It's defined like this:

<smartFilterBar:ControlConfiguration
    key="MyOwnFilterField" index="1" label="Custom Filter Field"
    groupId="_BASIC" width="300px" mandatory="mandatory"
    visibleInAdvancedArea="true">

    <smartFilterBar:customControl>
      <m:Select id="foo" customData:hasValue="true">
        <core:Item key="1" text="ONE"/>
        <core:Item key="2" text="TWO"/>
        <core:Item key="3" text="THREE"/>
      </m:Select>
    </smartFilterBar:customControl>

</smartFilterBar:ControlConfiguration>

The values and selected keys of all fields are saved when the variant is saved, except for the values in the custom field.

I also want to store the values in the custom field, in the example it's a select. Is there a way to do that?

OMG this question made me aware of a bug in one app I created. I have never noticed that. — fabiopagoti, Jan 14 '19 at 13:52

score 1 · Accepted Answer · answered Jan 14 '19 at 22:44

Since I'm saving the selected keys and values of my custom controls in a JSON model, saving and restoring them with the LREP payload turned out to be reasonably straight forward. Setting a _CUSTOM key on the filter data populates a JSON model set on the filter bar itself called fi1t3rM0d31.

So for this field:

<smartFilterBar:ControlConfiguration 
  key="OrderTypeId" 
  index="0" 
  label="{i18n>orders.enquiry.ordertype}" 
  groupId="_BASIC" 
  visibleInAdvancedArea="true" 
  controlType="input">
  <smartFilterBar:customControl>
    <MultiComboBox 
      customData:hasValue="true" 
      selectedKeys='{filters>/filters/multi/OrderTypeId}' 
      items="{
              templateShareable: 'true', path: '/HelpValues',
              filters: [{path:'FieldName', operator:'EQ', value1: 'VBAK-AUART'}]
            }">
      <core:ListItem key="{Key}" text="{Value}"/>
    </MultiComboBox>
  </smartFilterBar:customControl>
</smartFilterBar:ControlConfiguration>

I can use these events on the Filter bar:

  /**
   * This event on the smart filter bar triggers before a variant is saved 
   * @param  {sap.ui.base.Event} oEvent 
   */
  beforeVariantSave: function(oEvent) {
    oEvent.getSource().setFilterData({_CUSTOM:this.getModel('filters').getProperty('/filters')});
  },

  /**
   * This event on the smart filter bar triggers after a variant is loaded 
   * @param  {sap.ui.base.Event} oEvent 
   */
  afterVariantLoad: function(oEvent) {
    var custom = oEvent.getSource().getFilterData()._CUSTOM;

    this.getModel('filters').setProperty('/filters', custom);
  },

... which in turns allows me to generate filters like this in the beforeRebindTable event on the smart table.

//multi keys
Object.keys(data.multi || {}).forEach(k => {
  var f = [];
  data.multi[k].forEach(v => {
    if (v) f.push(new Filter(k, FilterOperator.EQ, v));
  });

  if (f.length > 0) {
    this.aFilters.push(new Filter(f));
  }
});

Saving values in custom smart filter field

1 Answers1