Skip to Content

sap.m.select and filters

Hi, I'm a UI5 newbie so go easy one me :)

a question about filtering, I have 2 select boxes in my view, the first select box is the 'parent' and it's key is also a key of the second 'child' select box... each is bound to a different entity from my data model, see below

I need to filter the values of the second select box based on the selected value of the first.

So i have defined a function for the change event of the first select box. But I'm not sure how the function should work exactly, this is what I have so far... it clearly doesn't work.

onChange: function(evt) {
var selectedProject = this.getView().byId("projectSelectBox").getSelectedKey();
var filterByProject = new sap.ui.model.Filter("ProjectInternalId",sap.ui.model.FilterOperator.EQ,selectedProject);
var changeRequest = this.getView().byId("changeReqSelectBox");
changeRequest.bindAggregation("items",filterByProject);
		}

Am I even close...?

myview.png (7.4 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

2 Answers

  • Nov 03, 2017 at 04:08 AM

    Hey Neil Ward,

    Even as a newbie, you have done good work. To populate data in your second select box, based on your first select box, you need to first get the selected data , then filter your model and populate the recieved records in your second select box.

    /**
    			 * When the combo box is changed in a fragment.
    			 * @public
    			 */
    			selectChange: function(evt){
    				evt.getSource().setValueState(sap.ui.core.ValueState.Success);
    				var that = this;
                                    var mModel = new sap.ui.model.json.JSONModel(); //initialise your model from a JSON file
    				var id = this.oDialogFragment.getContent()[9].getSelectedItem().getText();
                                    //get the id first, then read the other model, you can even filter it.
    
    				this.model.read("/UserSet('"+id+"')",null,null,false,function(oData){
    					mModel.setData(oData);
    				},function(){
    					
    				});
    
    				var oItemSelectTemplate = new sap.ui.core.ListItem({
    				            key : "{Userid}",
    				            text : "{Userid}",
    				            additionalText: "{Username}"
    				        }); //Define the template for items, which will be inserted inside a select element
    				var mySelectMenu = this.oDialogFragment.getContent()[9]; //Get a reference to the UI element, Select to bind data
    				mySelectMenu.setModel(mModel);// set model your_data_model to Select element
    				mySelectMenu.bindAggregation("items","/results",oItemSelectTemplate); //bind aggregation, item to Select element with the template selected above
    
    
    
    				
    			},
    

    Read your model, then set the data to an template for your select, then you can set the model and perform bind aggregration.

    Hope this helps,

    Regards.

    Add comment
    10|10000 characters needed characters exceeded

  • Nov 03, 2017 at 08:34 AM

    Many thanks for answering Arjun, I'll try this out today.

    Add comment
    10|10000 characters needed characters exceeded