Scribd
Upload
32 views

JavaScript Form Validation Examples

This document provides examples of JavaScript form validation functions for checking non-empty fields, numeric fields, alphabetic fields, alphanumeric fields, email validation, and restricting field length. The functions use regular expressions to validate the field values and alert the user if validation fails.

Uploaded by

anugya2110135
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
32 views

JavaScript Form Validation Examples

This document provides examples of JavaScript form validation functions for checking non-empty fields, numeric fields, alphabetic fields, alphanumeric fields, email validation, and restricting field length. The functions use regular expressions to validate the field values and alert the user if validation fails.

Uploaded by

anugya2110135
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 9

JavaScript Form Validation

Examples
Checking for Non-Empty
<html>
<head>
<script type='text/javascript'>
function notEmpty(elem, helperMsg) {
if(elem.value.length == 0)
{ alert(helperMsg);
elem.focus();
return false;
}
return true;
}
</script> </head>
<form>
Required Field: <input type='text' id='req1'/>
<input type='button' onclick="notEmpty(document.getElementById('req1'),
'Please Enter a Value')" value='Check Field' />
</form> </html>
Checking for All Numbers
<script type='text/javascript'>
function isNumeric(elem, helperMsg)
{ var numericExpression = /^[0-9]+$/;
if(elem.value.match(numericExpression))
{ return true; }
else{ alert(helperMsg);
elem.focus(); return false; } }
</script>
<form> Numbers Only: <input type='text' id='numbers'/>
<input type='button'
onclick="isNumeric(document.getElementById('numbers'
), 'Numbers Only Please')" value='Check Field' /> </form>
Checking for All Letters
<script type='text/javascript'>
function isAlphabet(elem, helperMsg)
{ var alphaExp = /^[a-zA-Z]+$/;
if(elem.value.match(alphaExp))
{ return true; }
else{ alert(helperMsg);
elem.focus(); return false; } }
</script>
<form> Letters Only: <input type='text' id='letters'/>
<input type='button'
onclick="isAlphabet(document.getElementById('let
ters'), 'Letters Only Please')" value='Check Field' />
</form>
Checking for Numbers and Letters
function isAlphanumeric (elem, helperMsg)
{ var alphaExp = /^[0-9a-zA-Z]+$/;
if(elem.value.match(alphaExp))
{ return true; }
else{ alert(helperMsg); elem.focus(); return false; }
}
Email Validation
Every email is made up for 5 parts:
1.A combination of letters, numbers, periods,
hyphens, plus signs, and/or underscores
2.The at symbol @
3.A combination of letters, numbers, hyphens,
and/or periods
4.A period
5.The top level domain (com, net, org, us, gov, ...)
Email Validation
Valid Examples:
• [email protected]
• [email protected]
• [email protected]
Invalid Examples:
• @deleted.net - no characters before the @
• [email protected] - invalid character !
• shoes@need_shining.com - underscores are not
allowed in the domain name
Email Validation
function emailValidator(elem, helperMsg)
{
var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-
z]{2,4}$/;
if(elem.value.match(emailExp))
{ return true; }
else
{ alert(helperMsg);
elem.focus();
return false; }
}
Restricting the Length
function lengthRestriction(elem, min, max)
{
var uInput = elem.value;
if(uInput.length >= min && uInput.length <= max)
{ return true; }
Else
{
alert("Please enter between " +min+ " and " +max+ "
characters");
elem.focus();
return false; }
}

You might also like