javascript : How to prevent user from entering = in textbox?

Question

I have a requirement where i have to prevent users from entering = in textbox in entire application to prevent vulnerability.

<input type="text"></input>

I have been using antisamy-1.4.4.xml and XSSFilter.java which takes care of quite a few vulnerability checks but does not check for '=' sign entered in textbox. Is there anyway i can do for a textbox that will be done for the entire application?

JoshG · Accepted Answer · 2019-05-27T11:49:39.887

You could attach a listener to the input elements in the document, check if the user has pressed the = key, and if so, take an action.

Something like this should work:

const textInput = document.querySelector('input');
textInput.addEventListener("keydown", function(event) {
    if (event.keyCode === 187) {
     console.log("equals pressed");
        // Prevent default behaviour
        event.preventDefault();
        return false;
    }
});

<input type="text"></input>

But I wouldn't rely on this as being "secure" since a user can override the JS behavior in their browser. You should still sanitize the input on the server-side.

Update

To handle the case where a user pastes something into the input field, you could intercept the pasted string and strip the illegal characters (equals sign in this case).

Example:

textInput.onpaste = function(e) {
    e.preventDefault();
    clipboardData = e.clipboardData;
  pastedData = clipboardData.getData('Text');
  textInput.value = pastedData.replace("=", "");
}

Or you could just e.preventDefault() to disable pasting altogether.

Sorry, you said textbox so I assumed you meant textarea. I updated my code for input fields. — JoshG, Feb 14 '19 at 09:25
This works pretty fine except on one condition where we copy paste = in textbox. +1 for the answer from my side. — sTg, Feb 15 '19 at 05:49

CodeF0x · Answer 2 · 2019-02-14T09:10:54.293

0

On the frontend, you can use JavaScript to prevent that:

document.getElementById('text').onkeydown = function(e) {
  const code = e.which || e.keyCode;
  if (code === 187) {
    e.preventDefault();
  }
}

<input type="text" id="text">

But you always need to validate the input on the server-side too!

edited Feb 14 '19 at 09:10

answered Feb 14 '19 at 09:01

CodeF0x

2,624
6
17
28

But i need to perform the activity for the entire application. Adding this javascript will only help for a particular textbox. – sTg Feb 14 '19 at 09:04
@sTg Append an `eventListener` to every input field then. – CodeF0x Feb 14 '19 at 09:12

score 0 · Answer 3 · answered Feb 14 '19 at 09:01

first, you need to add selector class like id or class then you just need to add this js code to your page

$(document).ready(function () {
  $('#textnote').keydown(function (e) {
      if (e.keyCode == 61) {
          e.preventDefault();
          return false;
       }
  });
});

score 0 · Answer 4 · answered Feb 14 '19 at 09:03

You should listen to the keypress event of the input field and prevent the '=' key.

<script>
document.getElementById("text_input").addEventListener("keypress", function(event){
  if(event.which==187 || event.keyCode==187){
event.preventDefault();
}
});
</script>

javascript : How to prevent user from entering = in textbox?

4 Answers4