ng-options populated by ajax only displaying first letter in IE ng-options populated by ajax only displaying first letter in IE angularjs angularjs

ng-options populated by ajax only displaying first letter in IE


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.


See <select> only shows first char of selected option

We had the same issue and something like what's below got us around it.

$("select").css("width", $("select").css("width"));

Of course, all of our selects are the same width. You may need to refine the selector to suit your needs. Basically you just need to force IE to repaint the selects one way or another. Updated fiddle.


I just experienced this same problem in IE 9. The workaround is to only show the select after the ajax data is available. A simple solution in AngularJs is to add follow to the select: ng-show="ReasonsChoice_ajax.length > 0".

<select ng-model="Reason" ng-show="ReasonsChoice_ajax.length > 0" ng-options="Reason for Reason in ReasonsChoice_ajax"></select>