ruggeddesign
09-04-2006, 04:24 PM
Hi - I'm new.
I am a novice programmer building a complete Intranet system for a company, using PHP/JavaScript/MySQL and a little Flash. I have seen a lot of posts around this community and was wondering if I could get just a bit of help with this Form Validation function I created. It was working just perfect before I found out that IE doesn't really like getAttribute("for") very much - and I reworked the thing entirely.
I will go ahead and do a simple walkthrough of the code before you look at it - basically all that the function is supposed to do is:
- Gather all elements of the form
- Grab each element's "class" attribute (class 0=not required 1=required 2=email 3=dropdown select 4=checkbox)
- Validate each field individually (right now the function seems only to want to validate the first field, my loop isn't working properly and that's where my question is)
var W3CDOM = (document.getElementsByTagName && document.createElement);
function valiDate(formname)
{
validForm = true;
firstError = null;
errorstring = '';
var x = document.forms[formname].elements;
for (var i=0;i<x.length;i++)
{
var valRoutine = x[i].className;
var input = x[i];
alert(valRoutine);
if(valRoutine=="0")
{
}
if(valRoutine=="1")
{
if(x[i].value=="" || x[i].value==null)
{writeERROR(input,'* Required');}
}
if(valRoutine=="2")
{
if(document.getElementById(inputID).value=="" || document.getElementById(inputID).value==null)
{writeERROR(input,'* Required');}
else {
var str=document.getElementById(inputID).value;
var at="@";
var dot=".";
var lat=str.indexOf(at);
var lstr=str.length;
var ldot=str.indexOf(dot);
if (str.indexOf(at)==-1) // if (@ symbol not present in string)
{writeERROR(input,'* Required');}
if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr) // if (@ symbol missing, @ as 1st Char, @ as Last Char)
{writeERROR(input,'* Required');}
if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr) // if (dot missing, dot is 1st Char, dot is Last Char)
{writeERROR(input,'* Required');}
if (str.indexOf(at,(lat+1))!=-1) // if (there is more than one @)
{writeERROR(input,'* Required');}
if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot) // if (dot is before @ || dot comes too soon after @)
{writeERROR(input,'* Required');}
if (str.indexOf(dot,(lat+2))==-1)
{writeERROR(input,'* Required');}
if (str.indexOf(" ")!=-1) // if (there is a spce)
{writeERROR(input,'* Required');}
}
}
if(valRoutine=="3") // type="dropdown/select" | Check to make sure something is selected
{
if(document.forms[0].elements[i].selectedIndex=="0")
{ writeERROR(input,'* Required'); }
}
if(valRoutine=="4") // type="checkbox" | Make sure checkbox='checked'
{
if(!document.getElementById(inputID).checked)
{ writeERROR(input,'* Required'); }
}
if (!W3CDOM)
{ alert(errorstring); }
if (firstError)
{ firstError.focus(); }
if (validForm)
{ return true; }
return false;
}
}
function writeERROR(obj,message)
{
validForm = false;
if (obj.hasError) return;
if (W3CDOM)
{
obj.className += ' error';
obj.onchange = removeERROR;
var sp = document.createElement('span');
sp.className = 'error';
sp.appendChild(document.createTextNode(message));
obj.parentNode.appendChild(sp);
obj.hasError = sp;
}
else
{
errorstring += obj.name + ': ' + message + '\n';
obj.hasError = true;
}
if (!firstError)
{
firstError = obj;
}
}
function removeERROR()
{
this.className = this.className.substring(0,this.className.lastIndexOf(' '));
this.parentNode.removeChild(this.hasError);
this.hasError = null;
this.onchange = null;
}
Any help would be greatly appreciated - I know that it is my loop that isn't working because if I alert(valRoutine) inside the loop I only get one response for a form of any length - but I imagine the problem lays elsewhere.
I am a novice programmer building a complete Intranet system for a company, using PHP/JavaScript/MySQL and a little Flash. I have seen a lot of posts around this community and was wondering if I could get just a bit of help with this Form Validation function I created. It was working just perfect before I found out that IE doesn't really like getAttribute("for") very much - and I reworked the thing entirely.
I will go ahead and do a simple walkthrough of the code before you look at it - basically all that the function is supposed to do is:
- Gather all elements of the form
- Grab each element's "class" attribute (class 0=not required 1=required 2=email 3=dropdown select 4=checkbox)
- Validate each field individually (right now the function seems only to want to validate the first field, my loop isn't working properly and that's where my question is)
var W3CDOM = (document.getElementsByTagName && document.createElement);
function valiDate(formname)
{
validForm = true;
firstError = null;
errorstring = '';
var x = document.forms[formname].elements;
for (var i=0;i<x.length;i++)
{
var valRoutine = x[i].className;
var input = x[i];
alert(valRoutine);
if(valRoutine=="0")
{
}
if(valRoutine=="1")
{
if(x[i].value=="" || x[i].value==null)
{writeERROR(input,'* Required');}
}
if(valRoutine=="2")
{
if(document.getElementById(inputID).value=="" || document.getElementById(inputID).value==null)
{writeERROR(input,'* Required');}
else {
var str=document.getElementById(inputID).value;
var at="@";
var dot=".";
var lat=str.indexOf(at);
var lstr=str.length;
var ldot=str.indexOf(dot);
if (str.indexOf(at)==-1) // if (@ symbol not present in string)
{writeERROR(input,'* Required');}
if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr) // if (@ symbol missing, @ as 1st Char, @ as Last Char)
{writeERROR(input,'* Required');}
if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr) // if (dot missing, dot is 1st Char, dot is Last Char)
{writeERROR(input,'* Required');}
if (str.indexOf(at,(lat+1))!=-1) // if (there is more than one @)
{writeERROR(input,'* Required');}
if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot) // if (dot is before @ || dot comes too soon after @)
{writeERROR(input,'* Required');}
if (str.indexOf(dot,(lat+2))==-1)
{writeERROR(input,'* Required');}
if (str.indexOf(" ")!=-1) // if (there is a spce)
{writeERROR(input,'* Required');}
}
}
if(valRoutine=="3") // type="dropdown/select" | Check to make sure something is selected
{
if(document.forms[0].elements[i].selectedIndex=="0")
{ writeERROR(input,'* Required'); }
}
if(valRoutine=="4") // type="checkbox" | Make sure checkbox='checked'
{
if(!document.getElementById(inputID).checked)
{ writeERROR(input,'* Required'); }
}
if (!W3CDOM)
{ alert(errorstring); }
if (firstError)
{ firstError.focus(); }
if (validForm)
{ return true; }
return false;
}
}
function writeERROR(obj,message)
{
validForm = false;
if (obj.hasError) return;
if (W3CDOM)
{
obj.className += ' error';
obj.onchange = removeERROR;
var sp = document.createElement('span');
sp.className = 'error';
sp.appendChild(document.createTextNode(message));
obj.parentNode.appendChild(sp);
obj.hasError = sp;
}
else
{
errorstring += obj.name + ': ' + message + '\n';
obj.hasError = true;
}
if (!firstError)
{
firstError = obj;
}
}
function removeERROR()
{
this.className = this.className.substring(0,this.className.lastIndexOf(' '));
this.parentNode.removeChild(this.hasError);
this.hasError = null;
this.onchange = null;
}
Any help would be greatly appreciated - I know that it is my loop that isn't working because if I alert(valRoutine) inside the loop I only get one response for a form of any length - but I imagine the problem lays elsewhere.