How to Use the Dreamweaver Form Validation Feature
Sometimes, you may feel frustrated when you look at the form submissions that you get from a web form and find out that the respondents did not fill in some crucial details. This calls for some details on the form to become mandatory to fill in. for example, a form that is used to subscribe visitors to regular newsletters via email will be of no use if the user does not enter their email address.
Javascript code to validate email addresses
Validating email address in put using Javascript can be tricky. Contrary to popular belief, email addresses can contain almost all type of characters and a valid email address can take complex forms. For example, the email addresses below are perfectly valid: firstname+lastname@domain.com much.”more\ unusual”@example.com あいうえお@a.long.domain.example.university One of the straight forward way to validate an email address is using regular expressions Here is a moderately reasonable email validation function using regular expression:
JavaScript Form Validation - Confirm Password
Here is a quick JavaScript validation to check whether password and confirm password fields match. The code below compares the field( password and confirm password) values and displays the error message when the passwords does not match. Sample Javascript code for comparing password with confirm password function validateForm(event) { var password = document.getElementById('myform_password').value; var conf_password = document.getElementById('myform_confirm_password').value; if (password && password !== conf_password) { document.getElementById('error_pswd_match').classList.remove('hidden'); } else { document.getElementById('error_pswd_match').classList.add('hidden'); alert("Validation Success!
JavaScript Form Validation - Date
It may be tempting to validate date input using regular expressions. However, the better alternative will be to actually convert the date to a date object and test it. For example, a simple regular expression test would approve this date: 2011/02/29 perfectly valid but there is no such date (since 2011 was not a leap year) Validate dates in the format: MM/DD/YYYY (or MM-DD-YYYY or MM.DD.YYYY ) function validateDate_MMDDYYYY(input_date) { var parts = input_date.
JavaScript Form Validation - Phone Numbers
The easiest way to validate phone numbers using Javascript would be to use Regular expressions. However there are different formats of Phone numbers depending on the user’s preference. Here are some regular expressions to validate phone numbers Phone number validation using a simple Regular expression function validatePhoneNumber(input_str) { var re = /^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/im; return re.test(input_str); } This function will allow phone numbers entered in the formats like this (123) 456-7890 (123)456-7890 123-456-7890 1234567890 Try the working demo See the Pen eYmbjpG by Prasanth (@prasanthmj) on CodePen.
Javascript password validation alphanumeric string
In case you want to allow only alpha-numeric characters in your password, here is the validation to check that condition: Alpha-numeric regular expression test Here is the function to test whether the inut matches an alphanumeric pattern: function validateAlphaNumericPassword(pwd) { var re = /^[a-z0-9]+$/i return re.test(pwd) } Alphanumeric with hyphen Sometimes, you may want to allow some characters like hyphen ( - ) in addition to alpha-numeric characters. Here is the validation
Javascript password validation using regular expression
Suppose you want to validate whether the password has at least one number other than alphabetic characters. Here is the regular expression to validate that condition Check at least one number exists in the password Here is the regular expression validation that confirms at least one number exists in the password function validatePassword(pwd) { var re = /^(?=.*\d).+$/ return re.test(pwd) } This regular expression makes use of (positive lookahead assertion)[https://stackoverflow.com/a/1570916/1198745] (?
Javascript validation simple example code
Here is a simple form validation code that validates a simple form No additional library is used. It is pure Javascript First step - add an event listner for form submit event Here is the code that does that step: document.getElementById('myform').addEventListener('submit', validateForm); function validateForm() { } First, we get the form DOM object using the ID attribute of the form. Then we listen to the form submit event. Next, we have to validate each of the fields in the form.
JavaScript zip code validation
Zip code is the postal code used by the United States Postal Service (USPS). The basic format consists of 5 digits. Later, an extended code was introduced that contains a hyphen and 4 more digits. Some valid Zip Codes: 20521-9000 42223 85254 Here is a simple function to validate a ZIP code: function isUSAZipCode(str) { return /^\d{5}(-\d{4})?$/.test(str); } This function uses a regular expression that checks for 5 digits ( \d{5} ) followed by optional hyphen and four digits( (-\d{4})?
The Most Indispensable jQuery Form Validation Reference Guide
Using a library to do form validation can save lots of your development time. Being a tested and proven library guarantees it. jQuery Form validation library is the most popular validation library. This post collects all my notes and references on jQuery Form validation library. This includes a large bunch of sample code and a complete reference guide to all the built-in validation rules in the library. Reference Links: Website: http://jqueryvalidation.