From 855cf1c052ed6a88dff2d40b0c1b3cc898286adb Mon Sep 17 00:00:00 2001 From: Martin Staffa Date: Mon, 23 Mar 2015 23:05:47 +0100 Subject: [PATCH] fix(ngOptions): fix frozen ui in ie with more than one select[multiple] If there is more than one select next to each other, and the first select is wrappend in an element with display: inline or display: inline-block, all but the last select are completely unresponsive to any user input. This cannot be tested in a unit-test or e2e test. Closes #11314 Closes #11795 --- src/ng/directive/ngOptions.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/ng/directive/ngOptions.js b/src/ng/directive/ngOptions.js index fd71e7749beb..405c8879da3f 100644 --- a/src/ng/directive/ngOptions.js +++ b/src/ng/directive/ngOptions.js @@ -576,11 +576,16 @@ var ngOptionsDirective = ['$compile', '$parse', function($compile, $parse) { function updateOptionElement(option, element) { option.element = element; element.disabled = option.disabled; - if (option.value !== element.value) element.value = option.selectValue; + // NOTE: The label must be set before the value, otherwise IE10/11/EDGE create unresponsive + // selects in certain circumstances when multiple selects are next to each other and display + // the option list in listbox style, i.e. the select is [multiple], or specifies a [size]. + // See https://github.com/angular/angular.js/issues/11314 for more info. + // This is unfortunately untestable with unit / e2e tests if (option.label !== element.label) { element.label = option.label; element.textContent = option.label; } + if (option.value !== element.value) element.value = option.selectValue; } function addOrReuseElement(parent, current, type, templateElement) {