How to prevent user to enter specific key using Javascript
You can achieve that in a more simpler way like the following:
function onlyAlphabet(inputVal) { var patt=/^[a-zA-Z]+$/; if(patt.test(inputVal)){ document.getElementById('txtTravel').value = inputVal; } else{ var txt = inputVal.slice(0, -1); document.getElementById('txtTravel').value = txt; } }
<div class="form-group"> <label class="form-text">Travels Name</label> <input id="txtTravel" type="text" maxlength="50" oninput="onlyAlphabet(value)" /> </div>
Disabling enter key for form
if you use jQuery, its quite simple. Here you go
$(document).keypress(
function(event){
if (event.which == '13') {
event.preventDefault();
}
});
javascript : How to prevent user from entering = in textbox?
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>
Disable Enter key for whole form except one input inside it
I would use the keydown
event because it is fired first.
You just have to add an additionnal comparison to check the tagName of the element where the event fired.
$('#formId').on('keydown', function(e) {
var keyCode = e.keyCode || e.which;
var tag = e.target.tagName
if (keyCode === 13 && tag !=="TEXTAREA") {
console.log("Enter prevented")
e.preventDefault();
return false;
}else{
console.log("Enter is ok...")
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="formId">
<input type="text" value="ENTER does not work here"/><br>
<textArea>ENTER works here</textarea>
</form>
preventing user from entering certain characters while allowing others using jquery
$("input").on("input", function(){ $(this).val($(this).val().replace(/[^0-9]/g, ''));})
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script></head><body> <input type="text"></body></html>
how to prevent user not to enter alphabets in input fied?
Based on the discussion, you can restrict alphabets from getting entered using the code of the key pressed.
Refer to the below code:-
.ts:-
validateNumber(event) {
const keyCode = event.keyCode;
const excludedKeys = [8, 37, 39, 46];
if (!((keyCode >= 48 && keyCode <= 57) ||
(keyCode >= 96 && keyCode <= 105) ||
(excludedKeys.includes(keyCode)))) {
event.preventDefault();
}
}
HTML:-
<input type="password" placeholder="Enter Mobile no" formControlName="mobile_no" (keydown)="validateNumber($event)">
You can refer to the stackblitz here.
Related Topics
Check If a String Has White Space
What's the Best Way to Reload/Refresh an Iframe
How to Specify a Single File to Be Seed Only
Why React Props Are Passed Undefined to the Child Component
How to Delete Rows of Data Using Sequelize
Securityerror: Blocked a Frame With Origin from Accessing a Cross-Origin Frame
Validating Array of Different Object Shapes in Yup
How to Disable Onclick Without Altering Its Function
Using Html5/Javascript to Generate and Save a File
How to Apply CSS to Parent Using Child Selector - With CSS or Angular 2
Set Values in Input Type Date and Time in JavaScript
How to Use Aria-Expanded="True" to Change a CSS Property
How to Set a Header Field on Post a Form
Get the Contents of a Table Row With a Button Click
How to Find an Exact Word in a String
Stretch Height to Fit Content in React Native
Creating a Json Dynamically With Each Input Value Using Jquery