How to Prevent a Key Input from Appearing in Input Field

How to avoid html input field from showing `next` option instead of `go` (On mobile keyboard)

One solution or workaround is to set the type to search:

<input type="search" />

It's a bit odd to have to press a magnifying glass to add a tag in my usecase, but it works. And any of the other property values don't seem to produce the same result as I want: https://www.w3schools.com/html/html_form_input_types.asp

Like submit will trigger submitting the form, not the field, afaik.

Disable Keyboard in Input Textfield

You should disable keyboard on your input like this:

$(function() {
   $('#datepicker').keypress(function(event) {
       event.preventDefault();
       return false;
   });
});

And Here is a working fiddle.

How can I disable keyboard input on an html input of type number? What about in react or material-ui?

This seems like a basic question, but I was surprised to not be able to find the answer anywhere, so I'm providing one here.

The key in both cases is to capture the onkeydown event and run its method preventDefault().

  <input type="number" min="0" max="100" step="2" value="10"
    onkeydown="preventKeyboardInput(event)" />

  <script>
    function preventKeyboardInput(event) {
      event.preventDefault();
    }
  </script>

  <input
    type="number"
    min={0}
    max={100}
    defaultValue={10}
    step={2}
    onKeyDown={(event) => {
      event.preventDefault();
    }}
  /> 

Material-UI's <TextField> is a wrapper around react's <input>, so all you need to do is pass onKeyDown down via inputProps, which you are already using to pass min, max, and defaultValue.

  const [value, setValue] = useState(10);

  return (
    <React.Fragment>
      <TextField
        name="name"
        type="number"
        label="label"
        inputProps={{
          min: 0,
          max: 100,
          step: 2,
          onKeyDown: (event) => {
             event.preventDefault();
          },
        }}
        defaultValue={value}
        onChange={(event) => {
          setValue(Number(event.target.value));
        }}
      />
    </React.Fragment>
  ); 

UPDATE: I've discovered roundabout that this breaks input boxes on touch devices, or at the very least iOS and iPadOS, neither of which display or allow input from spinners, which is probably why it was downvoted in the first place. Caveat emptor for anyone wanting to use this method.

How to not leave input field after tab key pressed? (javascript/html)

You can use onkeydown to declare a function on the document to capture all key presses (or just use the specific element). Use this to check for tab and execute your function accordingly.

document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.keyCode == 9) {
        evt.preventDefault();
        alert("Tab");
    }
};

Use preventDefault() to prevent the default action for the key pressed.

How to turn off html input form field suggestions?

What you want is to disable HTML autocomplete Attribute.

Setting autocomplete="off" here has two effects:

It stops the browser from saving field data for later autocompletion
on similar forms though heuristics that vary by browser. It stops the
browser from caching form data in session history. When form data is
cached in session history, the information filled in by the user will
be visible after the user has submitted the form and clicked on the
Back button to go back to the original form page.

Read more on MDN Network

Here's an example how to do it.

<form action="#" autocomplete="on">  First name:<input type="text" name="fname"><br>   Last name: <input type="text" name="lname"><br>   E-mail: <input type="email" name="email" autocomplete="off"><br>  <input type="submit"></form>