For my studies I need to create a simple script that checks if the entered data (suppose to be a 5 digit zip code) actually has 5 digits. If more or less then 5 digits entered, a alert should pop up.
So far I managed to get the alert for more and less then a 5 digit entry, but even when entering 5 digits, the alert will come up as well.
Since js is not my favourite subject I am lost, even tho it seems to be a simple thing.
Thanks in advance for answers and hints.
<script type="text/javascript">
<!--
function CheckZip ()
{
var content = document.forms['zipfield'].Field.value;
var length = content.length;
if (length >=5) (alert('Please enter a 5 digit zip code!'));
else if (length <=5) (alert('Please enter a 5 digit zip code!'));
else (length ==5) (alert('Valid entry'))
}
//-->
</script>
</head>
<body>
<div align="left">
<p>Please enter a 5 digit zip code</p>
<form name="zipfield" action="post"><input name="Field" size="5">
<br />
<br />
<input name="check" value="Check entry" onclick="CheckZip()" type="submit">
</form>
How about this:
if (content.length !== 5) {
alert('Please enter a 5 digit zip code!');
} else {
alert('Valid entry');
}
Check your condition..
When length is 5 it will go to the first if statemenet because you have specified it to be
>= 5
So when length is 5 , it will never hit the statement else (length ==5)
if (length >5) {
alert('Please enter a 5 digit zip code!')
}
else if (length <5) {
alert('Please enter a 5 digit zip code!')
}
else (length ==5) {
alert('Valid entry')
};
Better
if( length === 5){
alert('Valid entry');
}
else{
alert('Please enter a 5 digit zip code!');
}
Check Fiddle
You have other syntax errors in your script
if (length >=5) (alert('Please enter a 5 digit zip code!'));
--^-- Supposed to be { --^-- supposed to be }
Also you are ending the if loop with a semicolon ; .. Need to remove that ..
Otherwise the statement in else if and else will never be executed
5 is greater than or equal to 5, so the error alert will come up.
You should be using > and <, instead of >= and <=.
>= means greater than or equal to, <= means less than or equal to. Your problem is that if your input is exactly 5 characters long then:
if (length >=5)
Will evaluate as true, and you won't get to your else statement.
Related
$('.creditCardText').keyup(function() {
var foo = $(this).val().split("-").join(""); // remove hyphens
if (foo.length > 0) {
foo = foo.match(new RegExp('.{1,4}', 'g')).join("-");
}
$(this).val(foo);
});
I found this tutorial on putting dash after every 4 character from here my question is what if the character interval is not constant like in this example it is only after every 4 what if the interval is 3 characters "-" 3 characters "-" 4 characters so it would appear like this +1 123-123-1234 with country code +1.
I found this solution using an if else statement.
function autoDash(f)
{
length = f.value.length;
if(length<1){
f.value="+1-"+f.value;
}
else if(length == 6){
f.value=f.value+"-";
}
else if(length == 10){
f.value=f.value+"-";
}
}
<input type="text" id="tel" name="tel" maxlength="15" onkeydown="autoDash(this)" />
I have a form in which I have a field where the user enters their phone number and we force them to start with +34 followed by 9 digits (12 digits in total are what that field should have), but then when I change at +31 for example I pick it up as if it were +34, this is using a
<input type="text">
This is a variable
let phone2 = phone.length
This is the contidion I am using in Javascript
if (phone != '+34' & phone2 < 12) {
evt.preventDefault ();
alert ('The phone number must start with +34 and have at least 12 digits');
}
If anyone can help me
Try this:
Note that onblur means that the test function will fire when the input field loses focus. So, to run the test, type something and then click outside the input field.
const $ = document.querySelector.bind(document);
function test() {
const phone = $('input').value;
if (phone.substr(0, 3) !== '+34' || phone.length < 12) {
alert('The phone number must start with +34 and have at least 12 digits');
} else {
alert('good job');
}
}
<input onblur="test()" placeholder="Phone (must begin with +34)" />
This code should detect where a number is above 1,000,000,000 and below 9,999,999,999. I try to input numbers between these 2 values, but it still returns the else statement. Where is the problem in this code?
<html>
<head>
<title>Checking with RegExp</title>
</head>
<body>
<p>Enter a 10 digit number between 1000000000 and 9999999999.</p>
<textarea id="inputnumber"></textarea>
<button type="button" id="submitnumber">Check</button>
<script>
function checknumber() {
var tendigitnum = document.getElementById("inputnumber")
if (tendigitnum >= 1000000000 && tendigitnum <= 9999999999) {
alert("You entered the number" + tendigitnum + ".")
}
else {
alert("The page will refresh. Please enter a valid number.")
location.reload()
}
}
document.getElementById("submitnumber").onclick = checknumber
</script>
</body>
</html>
You're comparing an HTML element to a number. You want to compare a number to a number, by:
Using the .value property on the element to get the string, and
Parsing that string to a number (you have lots of different ways to do this depending on your use case; see this answer for a list of them)
For instance:
var tendigitnum = Number(document.getElementById("inputnumber").value);
Live Example:
function checknumber() {
var tendigitnum = Number(document.getElementById("inputnumber").value)
if (tendigitnum >= 1000000000 && tendigitnum <= 9999999999) {
alert("You entered the number" + tendigitnum + ".")
} else {
alert("The page will refresh. Please enter a valid number.")
location.reload()
}
}
document.getElementById("submitnumber").onclick = checknumber
<p>Enter a 10 digit number between 1000000000 and 9999999999.</p>
<textarea id="inputnumber"></textarea>
<button type="button" id="submitnumber">Check</button>
On modern browsers you could use a number input:
<input type="number" id="inputnumber">
and use its valueAsNumber property instead of value, since valueAsNumber will already be a number. You can even add the range validation to the input. More on MDN.
You need to check the value in your element, in your code you are checking element
I'm fairly new to javascript, so just looking for a bit of help with adding validation to a form (purely JS/jquery only):
Let's say I have the form getByID("text")
I want to add the validation to stop users entering a decimal place (whole numbers only), no letters or special characters (numbers only), value must not exceed 23 hours/59 minutes (two separate fields for HH:MM (so one must not exceed 23 hours, the other 59 minutes - see below)).
getByID("HH")
must not exceed digit 23 so 0-23 is allowed, no special chars/decimals/letters
getByID("MM")
must not exceed digit 59 so 0-59 is allowed, no special chars/decimals/letters
If anyone could help with this, it would be greatly appreciated. Thanks in advance!
<input type="" name="" id="hh" onkeyup="isNumber(event)" placeholder="HH">
<input type="" name="" id="mm" onkeyup="isNumber(event)" placeholder="MM">
<script type="text/javascript">
function isNumber(evt) {
var id = evt.target.id;
var val = $("#"+id).val();
if (val)
{
var numericReg = /^\d*[0-9](|.\d*[0-9]|,\d*[0-9])?$/;
if(!numericReg.test(val)) {
$("#"+id).val('');
alert('Numeric characters only');
}
else
{
if (id == 'hh')
{
if (val > 24)
{
$("#"+id).val('');
alert('Less than 24');
}
}
if (id == 'mm')
{
if (val > 60)
{
$("#"+id).val('');
alert('Less than 60');
}
}
}
}
}
</script>
I'm working on a page that has a text box and a button (there's more to it, but these are the things that are giving me trouble). When the button is clicked, it's supposed to verify that there are only 3 letters entered in the text box.
Here is the html creating the input box and button:
<form>
Enter 3 letters: <input type="text" id="3letters"> <br>
<input type = "button" id = "check" value = "Send" onclick="validate()">
</form>
And here is the Javascript function to check the input:
function validate() {
var TTinput = document.getElementById("3letters").value;
if(TTinput < 3) {
alert("Please enter 3 letters");
}
}
To test that this works I'm trying to enter only a single letter, but when I click the button, nothing happens. Any idea what I can do to fix this?
Check the length property:
if (TTinput.length < 3)
What you are doing is to set to the TTinput variable the value of the text box. So now TTinput contains a string. What you need is to get its length, and the length of a string in javascript can be got by the lenght property:
var str = "ABCD";
str.length; // 4
http://www.w3schools.com/jsref/jsref_length_string.asp
function validate() {
var TTinput = document.getElementById("3letters").value;
var input_length = TTinput.length;
if(input_length < 3) {
alert("Please enter 3 letters");
}
}
If you want exactly 3 characters use:
if(TTinput.length < 3 || TTinput.length > 3) {
alert("Please enter 3 letters");
}
or
if(TTinput.length != 3) {
alert("Please enter 3 letters");
}
*This (TTinput.length < 3) alone will consider 4, 7, 350,... characters valid.