Form Validation with JavaScript Regular Expressions (Part 2) - Defining the regular expressions
(Page 3 of 4 )
Next, you need to define the regular expressions that the script will match against your visitors' input:
var fnameRegxp = /^([a-zA-Z]+)$/;
This statement checks that only upper or lowercase case letters, repeated one or more times, pass the validation test, which, unless you’re hoping to send your newsletter to C3PO, should be the case. Remember when I mentioned that regular expressions can still return true if there are incorrect characters present, provided that the correct pattern of characters is somewhere within the string? Putting the circumflex and dollar sign at the beginning and end of the regular expression ensures that this does not happen, and that the string is only valid if it contains just what you’re asking for.
var lnameRegxp = /^([a-zA-Z]+)$/;
var houseRegxp = /^([0-9A-Za-z]+)$/;
These then check that the surname entered is also any upper or lowercase character repeated one or more times, and that the house name consists of just numbers and letters. You could have shortened this to /^([\w]+)$/ using the shorthand escape code for "any word character," but that would allow underscores to be used, which rarely feature in property names.
var pcodeRegxp = /^([A-Za-z]{1,2})([0-9]{2,3})([A-Za-z]
{2})$/;
var telnoRegxp = /^([0-9]{11})$/;
I’ve used local examples for the post code (the UK version of a zip code) and telephone regular expressions. UK postcodes are in a format consisting of one or two letters, followed by two or three numbers (depending on the county), and followed again by two letters. It should be easy to see how you could change this to match your own local form of postal or zip code and telephone number formats. The phone number check simply ensures that the correct number of numbers is present. Following these comes the most complex of regular expressions -- those that check for valid email addresses and URLs:
var emailRegxp = /^([\w]+)(.[\w]+)*@([\w]+)(.[\w]{2,3})
{1,2}$/;
var urlRegxp = /^(http:\/\/www.|https:\/\/www.|ftp:\/
\/www.|www.){1}([\w]+)(.[\w]+){1,2}$/;
Due to sub-domains, there may be any number of characters and dots preceding the @ sign. The first of these expressions says that any word character displayed one or more times can then be followed by a dot, then any number of word characters displayed zero or more times, followed by the @ symbol, followed by any word character displayed one or more times, followed by a dot and two or three word characters repeated at least once but no more than twice, so email addresses ending in .com or .co.uk will pass, whereas .co.uk.com would fail. Similarly, the URL may begin with either http://www. or https://www. or ftp://www. or just www. once followed by any word character one or more times, followed by a dot and any number of word characters at least once but no more than twice.
Finally, the date of birth check allows dates in the format dd/mm/yyyy or dd-mm-yyyy, both formats being equally as popular:
var dobRegxp = /^([0-9]){2}(\/|-){1}([0-9]){2}(\/|-)
([0-9]){4}$/;
Next: Testing the values submitted >>
More JavaScript Articles
More By Dan Wellman
|
| · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | | |
|