I have a text box that I want a person to add a number, and only a number into. How would I make a function that, if the value added to the text box was not a number, they would get an alert that said, "must add a number", or something similar. without using RegEx!
thanks!
http://www.w3schools.com/tags/att_input_type.asp
You want to use type="number" on your input field
Type a number:
<input type="number"/>
Here is a solution that you can use to only allow the user to enter numbers, they can´t add anything that´s not a number
<HTML>
<HEAD>
<SCRIPT language=Javascript>
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
</SCRIPT>
</HEAD>
<BODY>
<INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">
</BODY>
</HTML>
Related
I am using charcode so that user can input only number, special-character and comma.
<input type="text" class="form-control numOnly"
onkeypress="return event.charCode >= 48 && event.charCode <= 57">
Right now it is accepting only number but I want to allow special character and comma using charcode.
what am I missing?
Try Below
<input type="text" class="form-control numOnly" onkeypress="return event.charCode >= 32 && event.charCode <= 57">
<input type="text" class="form-control numOnly" onkeypress="return Validate(event);">
<script type="text/javascript">
function Validate(event) {
var regex = new RegExp("^[0-9-!##$%*?,]");
var key = String.fromCharCode(event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
event.preventDefault();
return false;
}
}
</script>
Here you can view all the javascript charcodes.
https://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
The comma one for example is 188.
You can also use https://github.com/KevinSheedy/jquery.alphanum to facilitate your life.
Edit: I noticed you have a class named NumOnly there. Is it only for styling?
I am trying restrict a user from entering more than 4 digits.
For that I am using:
$("#YEAR").mask("(9999)");
But I'm getting the following error:
JavaScript runtime error: Object doesn't support property or method 'mask'
Do I need to include a library for it?
A simple solution could be:
$(function () {
$('#YEAR').on('keypress', function(e) {
var charCode = (e.which) ? e.which : event.keyCode
if (charCode < 48 || charCode > 57) {
return false;
}
return true;
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input type="text" maxlength="4" id="YEAR" name="YEAR"/>
</form>
I have a script with a HTML form with a text field inside, right now this text field allows only numbers.
Although I would like to have the text field only allow numbers, and only allow the current value of a variable +1.
For example, say the current value of the variable(currentValue) is 1 then the only number you can put into the text field is 2.
Here is the code I have so far:
HTML:
<form id="value-form" action="value.php" method="POST" name="value-form">
<input onkeypress="return isNumberKey(event)" type="text" name="amount" id="amount" /> <!-- This is the text field I would like to only allow the value+1 -->
<input type="image" src="Button1.png" id="customButton" value="submit" alt="but"/>
</form>
Javascript:
function isNumberKey(evt) //This is the function I use to only allow numbers in the text field
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
var request = new XMLHttpRequest();
request.open('GET', 'currentValueFile.txt', false);
request.send();
var currentValue = request.responseText //this is the variable value I want to only allow +1 in the text field
document.getElementById("currentValue").innerHTML = currentValue;
<form id="value-form" action="value.php" method="POST" name="value-form">
<input onkeypress="return isNumberKey(event)" type="text" name="amount" id="amount" /> <!-- This is the text field I would like to only allow the value+1 -->
<input type="image" src="Button1.png" id="customButton" value="submit" alt="but"/>
</form>
<script type="text/javascript">
function toDec(code) {
return code - 48;
}
function isNumberKey(evt) //This is the function I use to only allow numbers in the text field
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57 || toDec(charCode) != currentValue + 1))
return false;
return true;
}
</script>
<script type="text/javascript">
var request = new XMLHttpRequest();
request.open('GET', 'currentValueFile.txt', false);
request.send();
var currentValue = parseInt(request.responseText) //this is the variable value I want to only allow +1 in the text field
</script>
Hey guys i've been having some issues with calling my javascript function to my main HTML page.
I've got the javascript code:
function phonenumber(inputtxt)
{
var phoneno = /^\d{10}$/;
if(inputtxt.value.match(phoneno))
{
return true;
}
else
{
alert("Not a valid Phone Number");
return false;
}
}
But when i call it in my HTML i have this code:
<input type='text' name='text1'/>Phone Number: <input type="submit" name="submit" value="Submit" onclick="phonenumber(document.form1.text1)"/>
Are you able to assist me with this? sorry i'm kinda new to this :(
Thanks!
Your onclick attribute needs to know if the validation passed or not. In other words, you should return the value from your validator function.
... onclick="return phonenumber(document.form1.text1)" ...
I don't understand why you using onlclick method for validate phone no. field. I have a function try this for validation of number
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : evt.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57) ) // put your condition here
return false;
return true;
}
and fire it by using
<input type="text" name="mobile" id="mobile" class="" onkeypress="return isNumberKey(event)" />
I have an html text box where I want to limit the numbers after decimal to 4.
After an operation it can be achieved using toFixed() but while the user inputs the text is there any way out.
Please guide me.
Did you Try a REGEX?
The Regex would look like
/^[0-9]+.[0-9]{4}$/
where {4} says that Length after . would be 4
Define REGEX:
var regex1=/^[0-9]+.[0-9]{4}$/;var yourtextfromTextBox= textBox.text();yourtextfromTextBox.match(regex1);
Try this
You can use onkeyup="yourFunction" function to do so.
Just an idea: jsFiddle live demo
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Round to 4 Decimal Places</title>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function() {
$('#input').keypress(function(){
try {
val = $(this).val().split('.');
if(val[1] > 999) return false;
}catch(e){}
})
});
</script>
</head>
<body>
<p>Type a decimal number in the TextBox, limited to 4 decimals</p>
<input id="input" type="text" />
</body>
</html>
Of course, this works only for ., this could be improved by allow only numbers, and check for , too.
Here's a sample: http://jsfiddle.net/Regisc/5yber/
This use a regexp to validate the content of the input and make use of this function in order to take carret into account.
Tested under Chrome (dev)
function decimal_only(e) {
var charCode = (e.which) ? e.which : window.event.keyCode
if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
if (charCode == 46) { //Now Check The Decimal only allow 1 decimal
if (e.value.indexOf('.') > -1) {
return false;
}
}
return true;
}
use this function on textbox event onkeypress.
like
onkeypress="return decimal_only(this)"
this will only allow 1 decimal and integer values to users