Filtering ComboBox with Selection of Another ComboBox in SAP Build Apps

Estimated read time 4 min read

Hi folks, in this blog post I will show you how to assign the value of first comboBox as a filter parameter to the second one.

First, we need two ComboBoxes on our canvas.

Then we need to create a text type page variable on variables section. Mine page variable is “selectedHeader”.

Then go to the properties of first comboBox and click on the list of options segment. Select mapping and add your source data. Mine source data is a data variable named “UploadDocumentHeader1” created from an oData integration’s data entity named “UploadDocumentHeader”. I selected “Vbeln” attribute to list. Also give the page variable that you created to the Input value of comboBox. So once user selects a value from your comboBox the selected value will be assigned to your page parameter.


And for the second comboBox we will follow the same steps but first create an object type page variable like this one below. We will use this list object as a list of second comboBox.

My source data for second comboBox is “ItemList” and I listed only “myPosnr” field of it. No need to assign an input value for the second comboBox for this project.


Now we can develop the logic canvas. Click on an empty area on view segment and open logic canvas. The idea here is once user change the value of “selectedHeader” which is value of the first comboBox, my other data entity “UploadDocumentItem” will be filtered and fetched then the fetched data will be assigned to the page variable “ItemList” which we gave to second comboBox as the list option. As you see we have also another event below and it is only for the loading phase of the page. We don’t want to use any filter when the application opening. That’s why on Page mounted event I set “ItemList” page variable without filtering it.

Here is my “Get record collection” node binded to upper event:


And here is my second “Get record collection” node binded to lower event:

That’s all. You can run the application and test it.

Please leave a comment if you have any questions or recommendations.

 

​ Hi folks, in this blog post I will show you how to assign the value of first comboBox as a filter parameter to the second one.First, we need two ComboBoxes on our canvas.Then we need to create a text type page variable on variables section. Mine page variable is “selectedHeader”.Then go to the properties of first comboBox and click on the list of options segment. Select mapping and add your source data. Mine source data is a data variable named “UploadDocumentHeader1” created from an oData integration’s data entity named “UploadDocumentHeader”. I selected “Vbeln” attribute to list. Also give the page variable that you created to the Input value of comboBox. So once user selects a value from your comboBox the selected value will be assigned to your page parameter.And for the second comboBox we will follow the same steps but first create an object type page variable like this one below. We will use this list object as a list of second comboBox.My source data for second comboBox is “ItemList” and I listed only “myPosnr” field of it. No need to assign an input value for the second comboBox for this project.Now we can develop the logic canvas. Click on an empty area on view segment and open logic canvas. The idea here is once user change the value of “selectedHeader” which is value of the first comboBox, my other data entity “UploadDocumentItem” will be filtered and fetched then the fetched data will be assigned to the page variable “ItemList” which we gave to second comboBox as the list option. As you see we have also another event below and it is only for the loading phase of the page. We don’t want to use any filter when the application opening. That’s why on Page mounted event I set “ItemList” page variable without filtering it.Here is my “Get record collection” node binded to upper event:And here is my second “Get record collection” node binded to lower event:That’s all. You can run the application and test it.Please leave a comment if you have any questions or recommendations.   Read More Technology Blogs by Members articles 

#SAP

#SAPTechnologyblog

You May Also Like

More From Author

+ There are no comments

Add yours