Just use the onKeyDown of the <input>

This commit is contained in:
Luke Barnard 2017-07-12 17:46:27 +01:00
parent 41cd238e02
commit 3e1a909b1d

View File

@ -40,12 +40,10 @@ module.exports = React.createClass({
componentDidMount: function() { componentDidMount: function() {
this.dispatcherRef = dis.register(this.onAction); this.dispatcherRef = dis.register(this.onAction);
document.addEventListener('keydown', this._onKeyDown);
}, },
componentWillUnmount: function() { componentWillUnmount: function() {
dis.unregister(this.dispatcherRef); dis.unregister(this.dispatcherRef);
document.removeEventListener('keydown', this._onKeyDown);
}, },
onAction: function(payload) { onAction: function(payload) {
@ -91,8 +89,6 @@ module.exports = React.createClass({
}, },
_onKeyDown: function(ev) { _onKeyDown: function(ev) {
// Only do anything when the key event target is the search input
if(ev.target !== this.refs.search) return;
switch (ev.keyCode) { switch (ev.keyCode) {
case KeyCode.ESCAPE: case KeyCode.ESCAPE:
this._clearSearch(); this._clearSearch();
@ -150,6 +146,7 @@ module.exports = React.createClass({
className="mx_SearchBox_search" className="mx_SearchBox_search"
value={ this.state.searchTerm } value={ this.state.searchTerm }
onChange={ this.onChange } onChange={ this.onChange }
onKeyDown={ this._onKeyDown }
placeholder={ _t('Filter room names') } placeholder={ _t('Filter room names') }
/> />
]; ];