Skip to Content
0

Combobox is not behaving as described.

May 02, 2017 at 11:40 AM

35

avatar image

If you take a look at this description of combo-box in here from experience Fiori Design Web.

Size S example has Meters in the text field and the results displayed contain the text at any part of the string, not just the beginning.

However the example here - in hana explored website does not behave in the same way. The results it show contain only the ones which have the search string at the beginning.

Looking for a solution to filter items of combobox which contain text in any part of the string in version 1.36.12.

Thanks in advance.

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

Sharath M G May 02, 2017 at 02:46 PM
0

Size S, M and L, is for the screen size and not the combo box.

Size S, when the screen is viewed in mobile and M - Tablet and L is large or generally in laptop or desktop screens.

Use Select or ComboBox. You can filter the contents in the dropdown or select from the list of values in it.

Regards,

Sharath

Show 1 Share
10 |10000 characters needed characters left characters exceeded

Thanks for the quick Reply. My problem is with Custom Filtering. I have partially solved the problem.

  1. Filtering the results if any part of the string matches. Not just from the beginning - Done using custom filter
  2. But after filtering, the dropdown is not active. User has to click the down arrow explicitly even though there are results. - This is where I need help

Below is my code

XML -

<ComboBox 
    id="myDropdown"
	width="100%"
	value="{/selectedCustomer}"
	items="{
		path: '/Customers',
		sorter: { path: 'Name' }
	}">
		<items>
			<core:ListItem key="{Name}" text="{Name}"/>
		</items>
</ComboBox>

Javascript -

onInit : function () {
	var vm = this;
	var myDrpdn = vm.getView().byId("myDropdown");
	var keyupListener = function (oEvt) {
	    if (((oEvt.keyCode || oEvt.which) == 38) || ((oEvt.keyCode || oEvt.which) == 40)) {
	    	// No filtering to be done when user is clicking up or down arrows
	    	return false;
	    }
	    var textID = '#' + myDrpdn.sId + '-inner'
	    var enteredText = $(textID).val();
	    vm.testFunction(enteredText);
	};


// Had to attach an event because there is no livechange or similar property on sap.m.combobox
	myDrpdn.attachBrowserEvent("keyup", keyupListener); 	
}
testFunction : function (searchString) {
    var aFiltersComboBox = [];
    // Filtering on Name field based on searchString
    var oFilterComboBox = new sap.ui.model.Filter("Name", sap.ui.model.FilterOperator.Contains, searchString);
    aFiltersComboBox.push(oFilterComboBox);
    this.getView().byId('myDropdown').getBinding("items").filter(aFiltersComboBox);
}
0