validate email address
Hi all,
I've got some javascript to validate entries on a webform. It checks to make sure that each required field has something in it. I would like to also validate that the email address at least looks like a valid one. Here's the javascript:
<script type="text/javascript">
function checkform(of)
{
// Test if DOM is available and there is an element called required
if(!document.getElementById || !document.createTextNode){return;}
if(!document.getElementById('required')){return;}
// Define error messages and split the required fields
var errorID='errormsg';
var errorClass='error'
var errorMsg='Please enter or change the fields marked with a ';
var errorImg='alert.gif';
var errorAlt='Error';
var errorTitle='This field has an error!';
var reqfields=document.getElementById('required').valu e.split(',');
// Cleanup old mess
// if there is an old errormessage field, delete it
if(document.getElementById(errorID))
{
var em=document.getElementById(errorID);
em.parentNode.removeChild(em);
}
// remove old images and classes from the required fields
for(var i=0;i<reqfields.length;i++)
{
var f=document.getElementById(reqfields[i]);
if(!f){continue;}
if(f.previousSibling && /img/i.test(f.previousSibling.nodeName))
{
f.parentNode.removeChild(f.previousSibling);
}
f.className='';
}
// loop over required fields
for(var i=0;i<reqfields.length;i++)
{
// check if required field is there
var f=document.getElementById(reqfields[i]);
if(!f){continue;}
// test if the required field has an error,
// according to its type
switch(f.type.toLowerCase())
{
case 'text':
if(f.value=='' && f.id!='email'){cf_adderr(f)}
// email is a special field and needs checking
if(f.id=='email' && !cf_isEmailAddr(f.value)){cf_adderr(f)}
break;
case 'textarea':
if(f.value==''){cf_adderr(f)}
break;
case 'checkbox':
if(!f.checked){cf_adderr(f)}
break;
case 'select-one':
if(!f.selectedIndex && f.selectedIndex==0){cf_adderr(f)}
break;
}
}
return !document.getElementById(errorID);
/* Tool methods */
function cf_adderr(o)
{
// create image, add to and colourise the error fields
var errorIndicator=document.createElement('img');
errorIndicator.alt=errorAlt;
errorIndicator.src=errorImg;
errorIndicator.title=errorTitle;
o.className=errorClass;
o.parentNode.insertBefore(errorIndicator,o);
// Check if there is no error message
if(!document.getElementById(errorID))
{
// create errormessage and insert before submit button
var em=document.createElement('div');
em.id=errorID;
var newp=document.createElement('p');
newp.appendChild(document.createTextNode(errorMsg) )
// clone and insert the error image
newp.appendChild(errorIndicator.cloneNode(true));
em.appendChild(newp);
// find the submit button
for(var i=0;i<of.getElementsByTagName('input').length;i++)
{
if(/submit/i.test(of.getElementsByTagName('input')[i].type))
{
var sb=of.getElementsByTagName('input')[i];
break;
}
}
if(sb)
{
sb.parentNode.insertBefore(em,sb);
}
}
}
function cf_isEmailAddr(str)
{
var at="@"
var dot="."
var lat=str.indexOf(at)
var lstr=str.length
var ldot=str.indexOf(dot)
if (str.indexOf(at)==-1){
return str.match();
}
if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
return str.match();
}
if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
return str.match();
}
if (str.indexOf(at,(lat+1))!=-1){
return str.match();
}
if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
return str.match();
}
if (str.indexOf(dot,(lat+2))==-1){
return str.match();
}
if (str.indexOf(" ")!=-1){
return str.match();
}
return str.match(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/);
***Note this was the original - didn't work.
//return str.match(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/);
}
}
</script>
Thanks in advance!
dartcoach
__________________
dartcoach
|