Raphael Moita Raphael Moita - 1 month ago 8
CSS Question

Disabling keyboard echoing in input text fields

Scenario:
I have a system that send data through json/websocket to a webpage, that page receives such data and update related fields.

Example to explain how it works:
- Page is loaded and focus is in an input text field (cursor is blinking on it),
- User presses some key that, through a back-end app, is captured directly from the serial port, do something with it, create a json including the captured data and send it to the web page (websocket)
- java script gets the data and populate the related field.

I'm looking for a way to disable any echoing from keyboard, and keep only page updated with the data that comes from the backend.

Read-only fields are not a option cause I need the blinking cursor showing up in the field being used.

Suggestion to block it on html/js/css, in the browser or even on Linux SO will be very appreciated.

Answer

I easily solve my issue using JQuery!

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).on("keypress", function (event) {
   if (event.which !== 0) {
      console.log('blocking keypress event');
      event.preventDefault();
   }
});
</script>
</head>
<body>
    <div>
        <label>Name: </label><input type="text" id="bef">
    </div>    
</body>
</html>

Now only data that comes from backend populates fields on that page.

Comments