aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorTobias Bosch2013-11-22 16:34:33 -0800
committerTobias Bosch2013-11-22 17:02:21 -0800
commita090400f09d7993d102f527609879cdc74abae60 (patch)
treee2fc4cba3509b32c00f33df2bf912246f3f5c7f9
parent84e0eea1645521f6a990a4dabeb53407db86eda2 (diff)
downloadangular.js-a090400f09d7993d102f527609879cdc74abae60.tar.bz2
fix(input): Support form auto complete on modern browser
Although modern browser support the "input" event, they still only fire the "change" event when they auto complete form elements other than the currently selected one. Related to #1460
-rw-r--r--src/ng/directive/input.js6
-rw-r--r--test/ng/directive/inputSpec.js26
2 files changed, 29 insertions, 3 deletions
diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js
index ea4d84f4..8307f7e8 100644
--- a/src/ng/directive/input.js
+++ b/src/ng/directive/input.js
@@ -449,15 +449,15 @@ function textInputType(scope, element, attr, ctrl, $sniffer, $browser) {
deferListener();
});
- // if user paste into input using mouse, we need "change" event to catch it
- element.on('change', listener);
-
// if user modifies input value using context menu in IE, we need "paste" and "cut" events to catch it
if ($sniffer.hasEvent('paste')) {
element.on('paste cut', deferListener);
}
}
+ // if user paste into input using mouse on older browser
+ // or form autocomplete on newer browser, we need "change" event to catch it
+ element.on('change', listener);
ctrl.$render = function() {
element.val(ctrl.$isEmpty(ctrl.$viewValue) ? '' : ctrl.$viewValue);
diff --git a/test/ng/directive/inputSpec.js b/test/ng/directive/inputSpec.js
index c6f5558a..892c1b7f 100644
--- a/test/ng/directive/inputSpec.js
+++ b/test/ng/directive/inputSpec.js
@@ -468,6 +468,32 @@ describe('input', function() {
expect(scope.name).toEqual('adam');
});
+ describe('"change" event', function() {
+ function assertBrowserSupportsChangeEvent(inputEventSupported) {
+ // Force browser to report a lack of an 'input' event
+ $sniffer.hasEvent = function(eventName) {
+ if (eventName === 'input' && !inputEventSupported) {
+ return false;
+ }
+ return true;
+ };
+ compileInput('<input type="text" ng-model="name" name="alias" />');
+
+ inputElm.val('mark');
+ browserTrigger(inputElm, 'change');
+ expect(scope.name).toEqual('mark');
+ }
+
+ it('should update the model event if the browser does not support the "input" event',function() {
+ assertBrowserSupportsChangeEvent(false);
+ });
+
+ it('should update the model event if the browser supports the "input" ' +
+ 'event so that form auto complete works',function() {
+ assertBrowserSupportsChangeEvent(true);
+ });
+ });
+
describe('"paste" and "cut" events', function() {
beforeEach(function() {
// Force browser to report a lack of an 'input' event