Skip to Content
Author's profile photo Krishnakant Joshi

Live Search and Value Help Request

This document will show the code for Live Search and Value Help Request input types.

I have used the microsoft’s Northwind Odata service for demo application.

1. Live Search

Code :

  var serviceUrl;
  var search = new sap.m.Input("searchInput", {
  placeholder : "Search",
  type: sap.m.InputType.Text,
  liveChange : function() {
  if (this.getValue().length > 0) {
  var oModel = new sap.ui.model.json.JSONModel();
  serviceUrl = "$filter=startswith(ContactName,%27an%27)";
  oModel.loadData(serviceUrl,null, false, "GET",false, false, null);
  this.bindAggregation("suggestionItems", "/value", new sap.ui.core.Item({text: "{ContactName}"}));


Live Search.png

2. Value Help Request


var vbox = new sap.m.VBox({
                  items : [
                    new sap.m.Label({
                      text: 'CategoryName'
                    // Create the input field, binding the suggested items to the
                    // product objects in the data model
                    new sap.m.Input("input_assisted1", {
                      type: sap.m.InputType.Text,
                      placeholder: 'Enter Product ...',
                      showSuggestion: true,
                      suggestionItems: {
                        path: "/value",
                        template: new sap.ui.core.Item({
                          text: "{CategoryName}"
                      showValueHelp: true,
                      valueHelpRequest: function (oEvent) {
                          var model = new sap.ui.model.json.JSONModel();
                          newurl = "$filter=startswith(CategoryName,%27"+sap.ui.getCore().byId("input_assisted1").getValue()+"%27)";
                          model.loadData(newurl,null, false, "GET",false, false, null);
                            // Handling of both confirm and cancel; clear the filter
                        handleClose = function (oEvent) {
                          var oSelectedItem = oEvent.getParameter("selectedItem");
                          if (oSelectedItem) {
                        // Create a SelectDialog and display it; bind to the same
                        // model as for the suggested items
                        if (!this._valueHelpSelectDialog) {
                                               this._valueHelpSelectDialog = new sap.m.SelectDialog("valueHelpSelectDialog", {
                            title: "Categories",
                            items: {
                              path: "/value",
                              template: new sap.m.StandardListItem({
                                title: "{CategoryName}",
                                active: true
                            search: function (oEvent) {
                              var sValue = oEvent.getParameter("value");
                              var oFilter = new sap.ui.model.Filter(
                                sap.ui.model.FilterOperator.Contains, sValue
                            confirm: handleClose,
                            cancel: handleClose
                            { this._valueHelpSelectDialog.setModel(model);




Happy Learning

Assigned Tags

      You must be Logged on to comment or reply to a post.
      Author's profile photo Marcel Frei
      Marcel Frei

      Thank you

      Author's profile photo Praveer Sen
      Praveer Sen

      Very helpful thanks for sharing..

      Author's profile photo Former Member
      Former Member

      Hi Krishnakant,

      I am trying to enhance the standard fiori CRM app "My Accounts" . I need to do the Search help functionality for input fields. I followed your approach its working fine upto  'F4 help' and 'Search'

      Now my problem is once the value selected from F4 help its working fine , again I need to click on F4 only the  selected value was displayed, Instead of that I need to get all values. How can I handle that. please suggest me. Could you please find the below screen snap for your reference.


      Sai Sravya

      Author's profile photo ALOK JAIN

      Dear your Live search functionality not working , I have copy the same .

      Could you please tell me what more required .