Validate form fields for no input with JavaScript (Rated 0)Description:
Checking that form fields have input is extremely important - having this performed before the form is submitted, client side, before its handled by anything at the backend such as an SQL or MS Access database, is vital and an additional factor in getting accurate input. This code contains functions to check null input and also to check if an email address follows a valid pattern. Code starts here
<script language="JavaScript" type="text/javascript">
// Javascript validation functions
// http://www.designplace.org/
//function to check empty fields
function isEmpty(strfield1, strfield2, strfield3) {
//change "field1, field2 and field3" to your field names
strfield1 = document.forms[0].field1.value
strfield2 = document.forms[0].field2.value
strfield3 = document.forms[0].field3.value
//name field
if (strfield1 == "" || strfield1 == null || !isNaN(strfield1) || strfield1.charAt(0) == ' ')
{
alert("\"Field 1\" is a mandatory field.\nPlease amend and retry.")
return false;
}
//url field
if (strfield2 == "" || strfield2 == null || strfield2.charAt(0) == ' ')
{
alert("\"Field 2\" is a mandatory field.\nPlease amend and retry.")
return false;
}
//title field
if (strfield3 == "" || strfield3 == null || strfield3.charAt(0) == ' ')
{
alert("\"Field 3\" is a mandatory field.\nPlease amend and retry.")
return false;
}
return true;
}
//function to check valid email address
function isValidEmail(strEmail){
validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i;
strEmail = document.forms[0].email.value;
// search email text for regular exp matches
if (strEmail.search(validRegExp) == -1)
{
alert('A valid e-mail address is required.\nPlease amend and retry');
return false;
}
return true;
}
//function that performs all functions, defined in the onsubmit event handler
function check(form)){
if (isEmpty(form.field1)){
if (isEmpty(form.field2)){
if (isEmpty(form.field3)){
if (isValidEmail(form.email)){
return true;
}
}
}
}
return false;
}
</script>
In your <form> tag, add onsubmit="return check(this);". Remember to edit the field names above, so that they correspond to your field names that you have defined using name="field".
Last Edited: 13-02-2003 20:17
Submitted by Devscripts on 25-02-2003 0:09 |