My Learnings in SAPUI5 Development – Part 3

[krish469]

Recently, I got a requirement to add an option “Select All” to the Multi Combo Box. I want to share my approach to achieve this functionality.

 

My Approach for the Solution:

I have downloaded code from SAPUI5 Samples for Multi Combo Box and have made changes as per this requirement.

 

1. Create a Multi Combo Box along with an event, which triggers at selection from drop down list.

2. Load data from local Json file, add “Select All” record and finally add to JSON Model oMCBModel [We write this code in onInit Function]

3. Now, we execute the code as is, we should be seeing “Select All” option in the drop down of Multi Combo Box

4. Implement the logic for “Select All”. If “Select All” is selected then all the items should be selected and if “Select All” is unselected then, all the items should be removed from selection. We write the code in event “SelectionChange” of Multi combo Box

5. With above function in place, if we click on “Select All” option then all the items are selected in the Multi Combo Box.

 

6. If “Select All” is unselected then, all the items are removed from the selection.

Source code is available at below mentioned location

https://plnkr.co/edit/HlmhJ4zrPY9MKZgSqEMc