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

IE placeholder input event fix suppresses an extra event with interpolation #8242

Closed
@jbedard

Description

@jbedard

109e5d1 introduced an issue which suppresses an extra input event when a placeholder changes due to interpolation and the input has a value. I believe the extra input event does not fire if the input has a value which causes the next real input event to be ignored. I haven't tested <IE11

See http://plnkr.co/edit/qZSjmzuQfzTbkI9eprcR?p=preview

The 2 inputs using interpolation in the placeholder suppress an extra input event on initialization and again each time the interpolation value changes.

Another issue not solved by 109e5d1 is shown in the last 2 inputs of the plunker. I'm not sure if that should be fixed within angular but it would be nice now that some of the placeholder issues are. Here is the fix I've been using, with 109e5d1 I just had to switch ignoreNextInput to false since angular handles that initial input event now. This doesn't handle the extra input event when the placeholder changes but that would be easy to add.

//input events order for inputs with placeholders in IE - the focus/blur input event only occurs if the input has no value
//  creation: input
//  focus:    focusin focus input
//  blur:     focusout input blur
var ignoreNextInput = !!$attrs.placeholder;

$element.on("focusin focusout", function(e) {
    ignoreNextInput = !!(!this.value && this.placeholder);
});

$element.on("input", function(e) {
    if (ignoreNextInput) {
        e.stopImmediatePropagation(); //(stopImmediate is used so the ng-model listener never receives it)
        ignoreNextInput = false;
    }
});

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions