First the code:
`$scope.myComboBox = {
settings: {},
dataAdapter: “”,
control: null,
create: false
};
$scope.myComboBox.settings = {
height: 30,
width: “100%”,
source: $scope.myComboBox.dataAdapter,
multiSelect: true,
showCloseButtons: false,
displayMember: “label”,
showArrow: true,
valueMember: “value”,
theme: “bootstrap”,
autoComplete: true,
enableBrowserBoundsDetection: true
};`
<div id="comboBoxId" jqx-combo-box jqx-create="myComboBox.create" jqx-instance="myComboBox.control" jqx-settings="myComboBox.settings" name="comboBoxName" ng-model="item.option" ></div>
That’s the settings object, I create the widget once the flag istrue`. The data adapter fetches the data nicely, it all works excellent, apart from one strange behaviour.
I let the user enter custom text in the ComboBox, in case the value he wants isn’t in the list. if the user starts typing and the beginning of what he’s typing matches a value, it all works great. But if he starts typing a value that doesn’t match any value, and then deletes that, the first item get’s selected and the control looses focus. This is the bad part where instinct kicks in and you try backspace, and because the control is not in focus, the user is redirected to the previous page.
Working example:
List of values: 111, 112, 113
User types 1 and then deletes and types whatever else, all good.
Non working example:
List of values: 111, 112, 113
User types 2 and then deletes, 111 get’s selected and control looses focus.
