5

The issue I am running into is I have a React App with a form with Input elements that I have a need to detect if the Enter Key or , has been pressed. It is working fine on desktop chrome but Android chrome (Samsung Note 9). First the mobile keyboard doesn't present an enter key but rather presents either a Next or Tab key. When I inspect the event the mobile is not registering the key, KeyCode, or charCode. I have tried onKeyDown, onKeyUp, onKeyPress with similar results.

I built this simple example to focus on the issue.

const handleKeyDown = (event)=>{
    event.preventDefault();
  console.log('Key: ' + event.key)
  console.log('KeyCode: ' + event.keyCode)
  console.log('CharCode: ' + event.charCode);
  console.log('Code: ' + event.code);
}

function App() {
  return (
    <div className="App">
      <h2>Test Input</h2>
<form action="">
<input id="sampleInput" type="text" onKeyDown={handleKeyDown}/>
<div>
<input id="sampleInput2" type="text" onKeyDown={handleKeyDown}/>
</div>
</form>
    </div>
  );
}

When I enter abc in the first input I get the following:

From mobile console: Key: Unidentified KeyCode: 229 CharCode: 0

this is the same for all keys

TagmanSr
  • 51
  • 2

0 Answers0