insin / insin/react-maskedinput
Doesn't work in Mobile Internet Explorer
- Dominant language
- JavaScript
- Stars
- 727
- Forks
- 191
- PR merge metrics
- No merged PRs in 30d
Description
From what I've read Mobile Internet Explorer doesn't support the onKeyPress event, which is breaking this implementation. I've looked at the open pull request for android (https://github.com/insin/react-maskedinput/pull/47) and was able to make a working version that supports Android as well as browsers that support onKeyPress, by doing this:
```
var event = {};
if (!userAgent.match(/Android/i)) event.onKeyPress = this._onKeyPress;
else event.onBeforeInput = this._onKeyPress;
return (
this.input = r }
onChange={this._onChange}
onKeyDown={this._onKeyDown}
onPaste={this._onPaste}
{...event}
placeholder={this.props.placeholder}
value={this._getDisplayValue()}
/>
);
```
I wish there was some feature detection for onkeypress support or onbeforeinput support... any ideas anyone?
This works great for Android, but I also found that Mobile Internet Explorer wasn't working. I tried all kinds of ways to bind the functions in this env, but it came down to this. Most browsers fire events in this order from a keyboard input (key down -> key press -> before input -> input -> key up). But Mobile IE does this: (key down -> key up -> input) NOTE: no keypress and the input is post key up and no before input. Anyway, I hope this helps someone, but I wasn't able to quite get it to work on Mobile IE. For now I fall back to unmasked inputs for Mobile IE, but I'd really like to fix this if possible.
Contributor guide
Assessment
This issue has not been assessed yet.