hrishi
hrishi

Reputation: 1561

How can I prevent users from using the backspace or delete keys in a textbox using JavaScript?

How can I prevent users from using the backspace or delete keys in a textbox using JavaScript?

I have a text box in my web form. I want to use JavaScript on keypress of the textbox to disable the delete and backspace keys.

Can anyone help?

Upvotes: 2

Views: 8979

Answers (3)

Asma Alfauri
Asma Alfauri

Reputation: 109

using javascript create function takes the event keyboard typing then avoid backspace (key-code 8) and delete (key-code 46) keys

function preventBackspace(e) {
  var evt = e || window.event;
  if (evt) {
      var keyCode = evt.charCode || evt.keyCode;
      if (keyCode === 8 || keyCode === 46) {
          if (evt.preventDefault) {
              evt.preventDefault();
          } else {
              evt.returnValue = false;
          }
      }
  }
}
<input onKeyDown="preventBackspace()" placeholder="Try write Something and enter backspace...">

Upvotes: 0

David
David

Reputation: 15350

Here's a bit of code to block the certain key press events - or something along those lines (haven't tested the code).

function isValidKey(e)
{
    var charCode = e.keyCode || e.which;
    if (charCode == 8 || charCode == 46)
        return false;

    return true;
}

<input id="tb_box" onkeydown="return isValidKey(event)" type="text" />

Upvotes: 3

scunliffe
scunliffe

Reputation: 63588

Why are you letting people edit the contents of the text box but restricting them from being able to use basic editing keys? This sounds like you are creating a major usability issue - what if the user makes a typo?

I'd recommend either setting the readonly flag (if you don't want users to edit the value) or disabled flag (if you don't even want it submitted)

Upvotes: 13

Related Questions