Javascript Form Validation Function

Wednesday, May 17. 2006

by: Jeff Anderson (from Codetoad)
A javascript validation function that you can use to validate all types of forms.

In several other tutorials, we have looked at various functions to check aspects of form validation :

IsNumeric
IsEmpty
IsValidEmail

Here we are going to bring these all together, by writing a ValidateForm function that can call these, or other similar functions. You can then adapt this script to validate the particular fields you need in the way you require.

Ammend your

tag, so it looks something like this:

What the onsubmit method does here is waits for the results of the ValidateForm function. If it returns true, our validation has succeeded - the form entries are in an acceptable form. If it returns false, there has been an error, and the user will need to correct it before being allowed to submit the form. So now let's have a look at the ValidateForm function itself. Exactly how it will look of course will depend on the fields you need to validate.

function ValidateForm(form)
{
if(IsEmpty(form.account_number))
{
alert('You have not entered an account number')
form.account_number.focus();
return false;
}

if (!IsNumeric(form.account_number.value))
{
alert('Please enter only numbers or decimal points in the account field')
form.account_number.focus();
return false;
}

return true;

}

To understand this function, remember that the return statement exits from the function and returns the code to the calling statement. Therefore, if the field 'IsEmpty', we alert the user, set the focus of the form to the appropriate field, and return false as the result. The calling statement reads the false value and does not submit the form. The user remains on the same page, with the focus pointing them to the error of their ways.

If however all the checks are verified, at the end of the ValidateForm function, we have a return true statement, meaning the form will submit successfully.

Posted by Hoogenraad (profile) in Scripts at 13:31 | All of Hoogenraad | Comments (0) | Trackbacks (2) | Back

Trackbacks

Trackback specific URI for this entry

No Trackbacks

Comments

Display comments as (Linear | Threaded)

No comments

Add Comment

Name
Email
Homepage
In reply to
Comment	Enclosing asterisks marks text as bold (word), underscore are made via _word_. Standard emoticons like :-) and ;-) are converted to images. To prevent automated Bots from commentspamming, please enter the string you see in the image below in the appropriate input box. Your comment will only be submitted if the strings match. Please ensure that your browser supports and accepts cookies, or your comment cannot be verified correctly. Enter the string from the spam-prevention image above:
	Remember Information? Subscribe to this entry