From c85137d14eece1ac0ee12728f0f6d1174613009d Mon Sep 17 00:00:00 2001 From: Jason Bedard Date: Wed, 24 Sep 2014 00:13:10 -0700 Subject: [PATCH] fix(inputs): ignoring input events in IE caused by placeholder changes or focus/blur on inputs with placeholders --- src/ng/directive/input.js | 32 +++++++++++++++++++++++--------- 1 file changed, 23 insertions(+), 9 deletions(-) diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js index afeab15cdfbe..26a363b05621 100644 --- a/src/ng/directive/input.js +++ b/src/ng/directive/input.js @@ -475,7 +475,6 @@ function addNativeHtml5Validators(ctrl, validatorName, badFlags, ignoreFlags, va function textInputType(scope, element, attr, ctrl, $sniffer, $browser) { var validity = element.prop(VALIDITY_STATE_PROPERTY); - var placeholder = element[0].placeholder, noevent = {}; ctrl.$$validityState = validity; // In composition mode, users are still inputing intermediate text buffer, @@ -494,18 +493,33 @@ function textInputType(scope, element, attr, ctrl, $sniffer, $browser) { }); } + // IE (11 and under) seem to emit an 'input' event if the placeholder value changes or when + // an input with a placeholder gains or loses focus. These issues do not happen if the input + // has a value at the time. + if (msie && ('placeholder' in element[0]) && $sniffer.hasEvent('input')) { + var ignoreNextInput; + + // Changing placeholders triggers an input if there is no value + attr.$observe("placeholder", function ieIgnoreNextInputPlaceholder() { + ignoreNextInput = !element[0].value; + }); + + // Focus in/out triggers an input if there is no value but there is a placeholder + // Event orders: + // focus: focusin focus input + // blur: focusout input blur + element.on("focusin focusout", function ieIgnoreNextInputFocus() { + ignoreNextInput = this.placeholder && !this.value; + }); + } + var listener = function(ev) { if (composing) return; - var value = element.val(); - - // IE (11 and under) seem to emit an 'input' event if the placeholder value changes. - // We don't want to dirty the value when this happens, so we abort here. Unfortunately, - // IE also sends input events for other non-input-related things, (such as focusing on a - // form control), so this change is not entirely enough to solve this. - if (msie && (ev || noevent).type === 'input' && element[0].placeholder !== placeholder) { - placeholder = element[0].placeholder; + if (ignoreNextInput && ev && ev.type === 'input') { + ignoreNextInput = false; return; } + var value = element.val(); // By default we will trim the value // If the attribute ng-trim exists we will avoid trimming