Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit a090400

Browse files
committed
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
1 parent 84e0eea commit a090400

File tree

2 files changed

+29
-3
lines changed

2 files changed

+29
-3
lines changed

src/ng/directive/input.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -449,15 +449,15 @@ function textInputType(scope, element, attr, ctrl, $sniffer, $browser) {
449449
deferListener();
450450
});
451451

452-
// if user paste into input using mouse, we need "change" event to catch it
453-
element.on('change', listener);
454-
455452
// if user modifies input value using context menu in IE, we need "paste" and "cut" events to catch it
456453
if ($sniffer.hasEvent('paste')) {
457454
element.on('paste cut', deferListener);
458455
}
459456
}
460457

458+
// if user paste into input using mouse on older browser
459+
// or form autocomplete on newer browser, we need "change" event to catch it
460+
element.on('change', listener);
461461

462462
ctrl.$render = function() {
463463
element.val(ctrl.$isEmpty(ctrl.$viewValue) ? '' : ctrl.$viewValue);

test/ng/directive/inputSpec.js

+26
Original file line numberDiff line numberDiff line change
@@ -468,6 +468,32 @@ describe('input', function() {
468468
expect(scope.name).toEqual('adam');
469469
});
470470

471+
describe('"change" event', function() {
472+
function assertBrowserSupportsChangeEvent(inputEventSupported) {
473+
// Force browser to report a lack of an 'input' event
474+
$sniffer.hasEvent = function(eventName) {
475+
if (eventName === 'input' && !inputEventSupported) {
476+
return false;
477+
}
478+
return true;
479+
};
480+
compileInput('<input type="text" ng-model="name" name="alias" />');
481+
482+
inputElm.val('mark');
483+
browserTrigger(inputElm, 'change');
484+
expect(scope.name).toEqual('mark');
485+
}
486+
487+
it('should update the model event if the browser does not support the "input" event',function() {
488+
assertBrowserSupportsChangeEvent(false);
489+
});
490+
491+
it('should update the model event if the browser supports the "input" ' +
492+
'event so that form auto complete works',function() {
493+
assertBrowserSupportsChangeEvent(true);
494+
});
495+
});
496+
471497
describe('"paste" and "cut" events', function() {
472498
beforeEach(function() {
473499
// Force browser to report a lack of an 'input' event

0 commit comments

Comments
 (0)