Dynamic SuggestionItem not working for contains filter

[Former Member]

Hi All,

I tried to follow SAPUI5 demo on dynamic suggestion item whereby on event "suggest" I add new filter for the suggestion item binding.

The link to the demo is here: Sample: Input - Suggestions - Dynamic

The only difference with the sample is I am using oData model instead of Json and I use Contains as the Filter Operator.

handleSuggest: function(oEvent) {
                        var sTerm = oEvent.getParameter("suggestValue");
                        var aFilters = [];
                        if (sTerm) {
                            aFilters.push(new Filter("CompanyName", sap.ui.model.FilterOperator.Contains, sTerm));
                        }
                        oEvent.getSource().getBinding("suggestionItems").filter(aFilters);
                    }

When I debug the oData service in the backend, I notice getEntitySet return correctly based on the filter.

However, it seems like the input field behaviour still only show the result based on Start With filter because it will only suggest records that start with the search term that I typed.

Is the example given by SAP only applicable for StartsWith filter?

If yes, I found it quite redundant because the suggestion items itself already use Start With condition as default.

Is there a way to force my new filter result to be used as suggestion items shown for this specific input?

Thank you.

Regards,

Abraham

[saivellanki · Accepted solution]

Hi Abraham,

According to sap.m.Input code, I guess the default filter is set to 'StartsWith' filter operator.

I didn't find a way to change it, as you already mentioned if we go through explored sample even that way it is not working. However you can raise this as an issue and check with UI5 team? Issues · SAP/openui5 · GitHub

Regards,

Sai Vellanki.

[Former Member · Accepted solution]

Hi Sai,

Thank you for confirming that this is the standard behaviour and the sample give can only work one way.

I ended up using event liveChange instead of suggest and add several method call to make my required behaviour work:

handleSuggestCoCd: function(oEvent) {


        var cocdInput = oEvent.getSource();
        var aFilters = [];

        var sTerm = cocdInput.getValue();
        if (sTerm) {
            aFilters.push(new sap.ui.model.Filter("CompCodeText", sap.ui.model.FilterOperator.Contains, sTerm));
        }

        oEvent.getSource().getBinding("suggestionItems").filter(aFilters);
        console.log(oEvent.getSource().getBinding("suggestionItems").oLastContextData);
// this methods call trigger new suggestion item displayed
cocdInput.setShowSuggestion(true);
        cocdInput.setFilterSuggests(false);
        cocdInput.removeAllSuggestionItems();


},




    },

Using this approach, the suggested item will show only those value filtered by my specified filter condition which is Contains.

Hopefully this info can be useful for anyone that encounter similar issue as what I've encountered and I still hope some expert can take a look at this sample and clarify the behaviour issue that I raised.

Regards,

Abraham

[DK007 · Accepted solution]

Hi Abraham,

Can you please show me your view code snipet and liveChange event handler code? Do we need to add any additional functionality to show the suggestion items?

I'm also planning to enhance suggestion to support 2 filters with an OR.

Thanks in advance for your help.

Thanks,

Dheeram

[Former Member · Accepted solution]

Hi Dheeram,

Below is my view code snipet only for the input field and I include my liveChange event handler code in my previous post:

<Input change="onCoCdChange" id="cocdInput" showSuggestion="true" suggestionItemSelected="onCoCdSelected" suggestionItems="{/CompanySet}"
                            type="Text" value="{CompCodeText}" width="100%" liveChange ="handleSuggestCoCd">
     <suggestionItems>
                    <core:ListItem additionalText="{CompCode}" text="{CompCodeText}"/>
     </suggestionItems>
 </Input>

Like what I said, I only change the event from suggest event to liveChange event and 3 additional statement in my event handler code (See my comment on the code to know which lines that I added.

My background is ABAP and this is my first SAPUI5 apps so I'm not really sure whether this is the right approach but it serve my purpose well.

Hope it also work for you.

Thank you.

Regards,
Abraham

[DK007 · Accepted solution]

Hi Abraham,

Thanks for providing your view code snippet. Mine is same as your.

FYI, the reason why I asked yours view code, is because I'm seeing duplicate ID exceptions in the console. Even with same code as your, I'm still seeing duplicate ID errors. Are you seeing same error in your browser console???

Once again thank you.

Thanks,

Dheeram

[junwu · Accepted solution]

which line of code?

[DK007 · Accepted solution]

oEvent.getSource().getBinding("suggestionItems").filter(aFilters);

oInput.setShowSuggestion(true); 

Second line is giving error. If I'm not wrong at this line the items are created to display them in popup screen.

[junwu · Accepted solution]

I copied his code, I don't have your error in my case.

are sure you are using exact same code?

[DK007 · Accepted solution]

Only difference is that my view is a JS and his is XML.

Other thing to note is we both are providing an ID for sap.m.Input field.

[junwu · Accepted solution]

that's big difference. don't use js view if possible

[former_member836220]

oInput.setFilterFunction(function (sTerm, oItem) {

return oItem.getText().match(new RegExp(sTerm, "i"));

});

---------------------------------------------------------------------------------------------------------

use this at the end of your code(function), it will work .

oInput is basically oEvent.getSource();

[saivellanki]

Hi / ,

I am not sure, why I haven't provided a proper answer for this question.

More robust way to achieve this kind of requirement would be extending Input control to accept 'contains' as suggestion filter.

Will this sample help? Plunker

You can type any of the below values:

          var aData = [{
            "Name": "Power Projector 4713"
          }, {
            "Name": "Power Tag"
          }, {
            "Name": "Webcam Small"
          }, {
            "Name": "Webcam"
          }, {
            "Name": "Monitor Locking Cable"
          }, {
            "Name": "Laptop Case"
          }, {
            "Name": "Laptop Small"
          }, {
            "Name": "USB Stick 16 GByte"
          }, {
            "Name": "Deskjet Super Highspeed"
          }, {
            "Name": "Deskjet Super1"
          }, {
            "Name": "Deskjet Super2"
          }];

Regards,

Sai.

[Former Member]

Hi Sai,

Thank you for your quick and useful answer

[Former Member]

Hi Abraham,

thanks a lot for your nice solution

You solved my problem with suggestions, now I have what I need

[junwu]

not working here.

i end up with using SelectDialog

[Former Member]

Thank you everyone for the response.

Hmm, so it seems like it is also not working for everyone.

I plan to use SelectDialog also but feels like user experience will be better if user can just type in whatever they think of and the system display records that contains that search term.

It would be good if SAP can confirm that this sample that they give is only working for StartWith filter and not for any other filter even though it is quite redundant because without this filter the suggestionItem already work with beginsWith in the first place.

[Former Member]

Hi All,

It is quite odd that I asked based on SAP sample but seems like no suggestion yet about this.

Is it because my question is not clear enough or more information needed?

Thank you.

Regards,

Abraham

[agentry_src]

Calling , , and anyone else out there who is familiar with this topic.

Thanks, Mike (Moderator)

SAP Technology RIG

[DK007]

Hi,

Not sure why it is not working. I tried to add 2 filter with a OR condition, even this one also not working with sap.m.Input with suggestion.

I'm using 2 filter with OR condition with sap.m.SearchFiled in master screen and its working.

Any pointer would be helpful.

Thanks,

Dheeram