Trouble setting ngModel for chosen dropdown programmatically.
See original GitHub issueHi, I’m trying to programmatically set the value for some dropdowns using chosen, but I’m struggling to get the dropdown to actually display the corresponding value. I have a dropdown that looks like this:
<select name="testitem" class="form-control" chosen allow-single-deselect="true" ng-model="item.itemID" ng-options="option.optionID as option.Text for option in options track by option.optionID">
<option value=""></option>
</select>
And my ngOptions data looks like this:
$scope.options = [
{optionID: 101, Text: 'Text to display in options'},
{optionID: 102, Text: 'Text to display in options 2'},
{optionID: 103, Text: 'Text to display in options 3'}
];
In my Angular controller for the view, I’m immediately setting the data for $scope.options and then $scope.item.itemID, but no matter what value I throw in that itemID, the chosen dropdown doesn’t update to reflect it. I’ve checked the markup and verified that a <select> element containing <option> elements with optionIDs for their values is being generated and the values I’m choosing line up. I’m very confused, because we have another project that uses (key, value) syntax in the ngOptions attribute where this behavior works as expected. Is there something special about using (key, value) in ngOptions that allows chosen to respect the two-way data binding, or is there something else that I’m missing?
Issue Analytics
- State:
- Created 8 years ago
- Comments:10 (2 by maintainers)
Top GitHub Comments
+1
I have found that this is broken only when using
track by
in theng-options
.@swiftened as same way you would do with a normal
<select>
, the correct way is using a model with your ID only. You don’t needtrack by
in that case, like so:An example working http://plnkr.co/edit/UH35hn?p=preview