Well, I can’t stop appraising the ease and simplicity of using SAP’s No-Code platform, when I was implementing basic operations and that too by using formulas!

Introduction

Recently, I was working on an SAP Build Apps project, where I was trying to integrating it with a few free APIs. Later, I had to implement a simple Filter in my app. Before implementing it, I thought of going through expert content on SAP Community to find out different ways to do it.

I came across a lot of good content on SAP Community, talking about SAP Build Apps, some on how to apply filters, a few questions on should we apply filter at client side or in backend and so. Finally, I decided to implement it in my own way. I just wrote a simple formula to achieve this. If you have worked with Excel spreadsheet functions, then you got to know it follows the same concept.

What you are going to learn and implement

What was the formula?

IF(appVars.filterText==””,data.ProductList,SELECT(data.ProductList, CONTAINS(UPPERCASE(item.Name),UPPERCASE(appVars.filterText))))

What it does?

It checks whether a variable filterText is empty, and displays the entire list, else, it takes the content from filterText variable and check if it is exists in the list and displays it. I have explained it below.

Again, if your dataset is huge, my recommendation still falls in place to go with other blogs floating on SAP Blogs platform about which way to use. I will still stick to sharing a small chunk of learning here, which is just applying filter.

Now refer to the below use case, where you see a single page app developed using SAP Build Apps, displaying some dummy Product data with a search box.

App with dummy data

I have integrated the Northwind oData service. You can find the direct link here (select Products Entity Set for this exercise).

What is the Objective?

Search a product. How? Type in a product name and data should be filtered as you key in the characters.

How have I implemented it?

I had implemented it in just a few steps, after creating the app and integrating the oData service.

Step 1: Assign an App variable of type text to the search box. I am using fiterText as the variable name.

App Variable in SAP Build Apps

Step 2: Go to the Repeat With property of the list item component and bind it to the formula.

Insert formula from here

Select Formula Binding Type

How I created the formula?

Write/Copy Paste Formula Here

Before writing a formula, find out 2 things from the oData service.

1. What is the entity set, in this case it is Products and I have bound it to a Data variable, ProductList.
2. What is the field name where you will apply filter? Here it is Name.

You can copy the same function and modify the variable names as you have defined.

IF(appVars.filterText==””,data.ProductList,SELECT(data.ProductList, CONTAINS(UPPERCASE(item.Name),UPPERCASE(appVars.filterText))))

What are the functions used?

CONTAINS, Text function to check if the text we type exists in any of the product names in the ProductList.

SELECT, a List function, will display searched items from the ProductList.

UPPERCASE, again a Text function, converts letters to upper case. I used it because I wanted to compare both input text and the names in the same case, else it will expect an exact match.

IF, a Utility function to display my entire ProductList, when search box is empty and otherwise.

Kindly Note: The Formula Functions are case-sensitive.

Conclusion

Finally, launch and preview the app to see the output.

Output

The steps to create a project, insert component, bind the oData service and create a data variable, launch the app in preview will be covered in the other blogs of my new “Learning SAP Build Apps from Basics” series.

Feel free to post your comments and connect with me Chandra Bhushan Singh.

Find out how you can build apps, automations, and sites without professional coding skills to easily digitalize your daily work by exploring SAP’s free learning content on SAP Build. It is designed for business users who want to rapidly develop software using little or no code at all, working only with visual programming tools and drag-and-drop components. Check out even more role-based learning resources and opportunities to get certified in one place on SAP Learning site.

Stay tuned!