I want to validate the string which the user enters into a textbox. I have to prevent user from entering alpha characters into the textbox and I also want to restrict user to entering no more than 6 digits, and also prevent the user from entering special characters into the textbox. I have tried the below code which is working when the user manually enters the value in textbox, but it's not working when the user pastes the some code into textbox.
<input type="text" name="textbox" id="textbox" class="form-control" required>
$("#textbox").on('keypress', function(e) {
var length = 6;
var validationtype = 'numeric';
var stringLength = $('#textbox').val().length;
if(stringLength < length) {
if(validationtype == 'alphanumeric') {
if (e.which != 8 && e.which != 0 && ((e.which < 65 || e.which > 122) || (e.which < 48 || e.which > 57))) {
return false;
}
} else if (validationtype == 'numeric') {
if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
return false;
}
}
} else {
return false;
}
});
Just use Paste event to handle this the same way.
/*Click and Past events*/
$("#textbox").on('keypress', function(e) {
return onTextChange(e, this);
});
$("#textbox").on("paste", function(e){
return onTextChange(e, this);
});
/*--------------------*/
function onTextChange(e, thisRef){
let length = 6;
let stringLength = $(thisRef).val().length;
let validationtype = 'numeric';
if(stringLength < length && e.which !== undefined) {
if(validationtype == 'alphanumeric') {
if (e.which != 8 && e.which != 0 && ((e.which < 65 || e.which > 122) || (e.which < 48 || e.which > 57))) {
return false;
}
} else if (validationtype == 'numeric') {
if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
return false;
}
}
} else {
return false;
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" name="textbox" id="textbox" class="form-control" required>
Related
I have written following jquery for allowing only capital and small alphabets to a textbox
$(".only-alphabets").keypress(function(e) {
if (e.which != 8 && e.which != 0 &&
(e.which < 65 || e.which > 90) && (e.which < 96 || e.which > 105)
) {
return false;
} else {
return true;
}
Now it works fine for A to Z but works only for a to i in small case.
Please help !!!
$(".only-alphabets").keypress(function(e) {
if (e.which != 8 && e.which != 0 &&
(e.which < 65 || e.which > 90) && (e.which < 96 || e.which > 122)
) {
return false;
} else {
return true;
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class='only-alphabets'>
ASCII code for lower case is from a-96 to z-122
You use regular expression:
$("#myTextBox").on("input", function(){
var regexp = /[^a-zA-Z]/g;
if($(this).val().match(regexp)){
$(this).val( $(this).val().replace(regexp,'') );
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="myTextBox" />
$("#chartModal").keypress( function (e) {
if (e.which != 8 && e.which != 0 && e.which != 43 && e.which != 45 && e.which != 46 && (e.which < 48 || e.which > 57)) {
return false;
}
});
This accept +, - & . in between the number, which is not a number.
Try with this
$(document).ready(function () {
$('#chartModal').keypress(function(e) {
var key = e.charCode || e.keyCode || 0;
var keychar = String.fromCharCode(key);
if ( ((key == 8 || key == 9 || key == 46 || key == 35 || key == 36 || (key >= 37 && key <= 40)) && e.charCode==0) /* backspace, end, begin, top, bottom, right, left, del, tab */
|| (key >= 48 && key <= 57) ) { /* 0-9 */
return;
} else {
e.preventDefault();
}
});
});
Here is an example:
$('#chartModal').keypress(function(e){
if (e.which != 8 && e.which != 0 &&e.which!= 43 && e.which!=45 && e.which !=46 &&(e.which < 48 || e.which > 57)) {
return false;
}
var charCode = e.which;
var value=$(this).val();
if(charCode==43 && value.indexOf('+')>=0) //Check whether a + is already there at beginning
return false;
if (charCode == 45 && value.indexOf('-') >= 0)//Check whether a - is already there at beginning
return false;
if (charCode == 46 && value.indexOf('.')!=-1)//Check at least one . is present in the number
return false;
});
Replace #idname with id of input.
In the below code i want to allow alphaets and to restrict special characters.But it is allowing special characters.pls help me to solve this issue.
JS:
function AcceptAlphabetsOnly(e, t) {
try {
if (window.event) {
var charCode = window.event.keyCode;
}
else if (e) {
var charCode = e.which;
}
else { return true; }
if ((charCode > 64 && charCode < 91) || (charCode > 96 && charCode < 123))
return true;
else
return false;
}
catch (err) {
alert(err.Description);
}
};
Asp.net
<input name="data[Customer][name]" type="text"
id="txtVendor" runat="server" onkeypress="return AcceptAlphabetsOnly(event,this);" />
Try the below function
function checkSpcialChar(event){
if (!((event.keyCode >= 65) && (event.keyCode <= 90) || (event.keyCode >= 97) && (event.keyCode <= 122) || (event.keyCode >= 48) && (event.keyCode <= 57))) {
event.returnValue = false;
return;
}
event.returnValue = true;
}
I have text boxes which only allow to enter numeric values. I handled it using a JavaScript. But it doesn't allow me to enter dot and tab movement. I need those two as well. How to change this code to enter dot symbol and tab movement.
function CheckNumeric(e) {
if (window.event) // IE
{
if ((e.keyCode < 48 || e.keyCode > 57) & e.keyCode != 8) {
event.returnValue = false;
return false;
}
}
else // Fire Fox
{
if ((e.which < 48 || e.which > 57) & e.which != 8) {
e.preventDefault();
return false;
}
}
this code is tested and works..this may help u..!!
<script type="text/javascript">
function onlyDotsAndNumbers(txt, event) {
var charCode = (event.which) ? event.which : event.keyCode
if (charCode == 46) {
if (txt.value.indexOf(".") < 0)
return true;
else
return false;
}
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
> <asp:TextBoxID="txt1"runat="server"onkeypress="return onlyDotsAndNumbers(this,event)"/>
The Question
To help avoid end-user confusion, I want to add an alert message that pops up if/when the user clicks any other key ["alert('Only Numerical data allowed')"]. So if they press the 'k' the above message will pop up. Can anyone see how to set this code within this code base
jsfiddle: http://jsfiddle.net/EN8pT/4/
The Code
jquery:
$('input.numberinput').bind('keypress', function (e) {
var w = e.which;
return (w != 8 && w != 0 && (w < 48 || w > 57) && w != 46) ? false : true;
});
html
<div class="containercontent">
<div class="label">Enter a number:</div>
<input type="text" name="txtNumber1" id="txtNumber1" value="" class="numberinput" />
<div class="label">Enter a number:</div>
<input type="text" name="txtNumber2" id="txtNumber2" value="" class="numberinput" />
</div>
Simple :
$(document).ready(function () {
$('input.numberinput').bind('keypress', function (e) {
if((e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57) && e.which != 46) )
{
alert('Only Numbers');
return false;
}
else{
return true;
}
});
});
Link : http://jsfiddle.net/justmelat/EN8pT/
Hello again :) I can help you out with this as well:
$(document).ready(function () {
$('input.numberinput').bind('keypress', function (e) {
var allow = (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57) && e.which != 46) ? false : true;
if (!allow) {
alert('Only Numerical data allowed');
}
return allow;
});
});?
JSFiddle: http://jsfiddle.net/EN8pT/3/
Enjoy and good luck!