How to create filters with AND and OR expressions in a mobile table

[Former Member]

If you have to create a mobile table you may need to create a search function for it.

First of all you will need a search field created in the view like this:

<SearchField search="handleSearch"></SearchField>

You will need also a mobile table with column data bind to different data model items:

<Table items="{registeredPlayers>/Users}" id="usersTable">

                                <columns>…</columns>

<ColumnListItem type="Navigation" press="handlePress" >

<cells>

<Text text="{ registeredPlayers>FirstName }"/>

<Text text="{ registeredPlayers>LastName }"/>

</cells>

</ColumnListItem>

</Table>

One of the differences between SAPUI5 sap.ui.table.Table and sap.m.Table is that the mobile table does not have a standard search function included. So if you create one input field for searching you will need to create a handler in the controller.

In case you are going to create one filter array and set it directly to the binding property of "items" you will create an AND expression search. Implemented like this the search will search for the query string in all bind properties - in the example both in the first name and in the last name. You can check the example code:

     handleSearch : function (evt) {

           var filters = [];

           var query = evt.getParameter("query");

           if (query && query.length > 0) {

                var filterFirstName = new sap.ui.model.Filter("FirstName", sap.ui.model.FilterOperator.Contains, query);

                filters.push(filterFirstName);

                var filterLastName = new sap.ui.model.Filter("LastName", sap.ui.model.FilterOperator.Contains, query);

                filters.push(filterLastName);

           }

           // update list binding

           var list = this.getView().byId("usersTable");

           var binding = list.getBinding("items");

           binding.filter(filters);

     },

If you want to create an OR expression search you will need to create the filters in a different way. This is the common case when you search for a query string that is contained in only one of the bind columns. In the example search in the first name column or in the last name column, you can create the filters like this:

handleSearch : function (evt) {

           var filters = [];

           var query = evt.getParameter("query");

           if (query && query.length > 0) {

                var orQueryfilters = [];

                var filterFirstName = new sap.ui.model.Filter("FirstName", sap.ui.model.FilterOperator.Contains, query);

                orQueryfilters.push(filterFirstName);

                var filterLastName = new sap.ui.model.Filter("LastName", sap.ui.model.FilterOperator.Contains, query);

                orQueryfilters.push(filterLastName);

                var filter2 = new sap.ui.model.Filter(orQueryfilters);

                filters.push(filter2);

           }