ng-options populated by ajax only displaying first letter in IE
angularjs, internet-explorer, internet-explorer-9
Solution
You are using Angularjs so the answer is like this:
<select ng-style="{'width': '100%'}"></select>
Note that you don't have to set width as 100%. You can use px instead.
Problem
I am experiencing an odd issue in Angular, seemingly only in Internet Explorer 9. If you check the following jsfiddle: http://jsfiddle.net/U3pVM/382/ You can see that the 2 selects are populated, but the display in IE seems broken, and only the first letter, 'A' of 'Apple' is selected. All options display when the select is clicked on. . The code is very simple, I populate the variable that drives the select in the success callback. ``` .success(function (data) { $scope.ReasonsChoice_ajax = data; }); ``` The ng-options code for the select is as follows; ``` <select ng-model="Reason" ng-options="Reason for Reason in ReasonsChoice_ajax"></select> ``` I have noticed that the glitch doesn't happen if I am using a single select element, it is only when I display multiple selects in an ng-repeat that the issue happens.