cancel
Showing results for 
Search instead for 
Did you mean: 

Input Field and suggestionItems

Former Member
0 Kudos

Hi experts,

I am trying to show a suggestion list when user types a username in an "Input"(sap.m.Input) field.

The filtering works for first username but for the next username it does not work.

The input field is defined as follows:


<Input

  id="productInput"

  type="Text"

  placeholder="Place Holder"

  liveChange="setSuggestion"

  suggestionItems="{username>/names}"

  suggest="handleSuggest"

  width="auto">

  <suggestionItems>

  <core:Item text="{username>name}" />

  </suggestionItems>

  </Input>

The functions are set as follows:


setSuggestion:function(oEvent){

  if(oEvent.getParameter("newValue").endsWith('@')){

  console.log("Suggest");

  lv_start_pos = oEvent.getSource().getFocusInfo().cursorPos - 1 ;

  this.getView().byId('productInput').setShowSuggestion(true);

  }else if(oEvent.getParameter("newValue").endsWith(' ')){

  console.log("Do not Suggest");

  lv_start_pos = undefined;

  this.getView().byId('productInput').setShowSuggestion(false);

  }

  },

  handleSuggest:function(oEvent){

  var sTerm = oEvent.getParameter("suggestValue").slice(lv_start_pos,oEvent.getSource().getFocusInfo().cursorPos);

  var aFilters = [];

  if (sTerm) {

  aFilters.push(new sap.ui.model.Filter("name", sap.ui.model.FilterOperator.StartsWith, sTerm));

  }

  oEvent.mParameters.suggestValue = sTerm;

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

  }

Here whenever user types @ the username has to be shown.

Hence the username is extracted using the setSuggestion function.

The names are defined as:


{

"names":[{"name":"@skk","id":"skkk"},

         {"name":"@ajjj","id":"ajjj"}

]

}

In the input field when for the first time when user types the username the suggestion list is displayed.

For ex: On typing "@" the usernames in the json are displayed. Now on selecting one entry from the list, on continuing to type as follows:

           "@ajjj @"

          the list is not displayed further.

Is there any way I can achieve the list display again?

Thanks in advance.

Thanks and Regards,

Sarath

Accepted Solutions (1)

Accepted Solutions (1)

saivellanki
Active Contributor
0 Kudos

Hi Sarath,

You may have to use MultiInput and make sure only one item would be selected. May be this sample helps? JS Bin - Collaborative JavaScript Debugging


Snippet:

Regards,

Sai Vellanki.

Former Member
0 Kudos

Thanks Sai. It works if we type the usernames while starting but not if we edit something in between.

For ex: @ajjj asfdsj...after this it does not work.

Answers (0)