It is true that the form validator of dreamweaver is very helpful in adding a simple validation for each of its elements, unfortunately it is limited in textboxes or textareas. So if you want to validate let’s say a checkbox, to see if it is checked or not, then your only solution is to program it yourself (if you have such a knowledge) or search in the web for help.
Today I wanted to validate such a checkbox and a dropdown menu (if anything is selected). For the checkbox, I was lucky enough to find the help from this URL: http://www.justskins.com/forums/checkbox-validation-97769.html.
After some editing from my part, I managed to make it work for my case, and here is the code for validating a checkbox, (and any text boxes). Btw, “form1” is the name and id of my form, “agree” is the name and id of my checkbox:
<script type="text/javascript"> function MM_validateForm() { //v4.0 if(document.forms["form1"].elements["agree"].checked){ getherrors=''; } else{ getherrors='- please read the disclaimer and confirm'; }
var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]);
if (val) { nm=val.name; if ((val=val.value)!="") {
if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@');
if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n';
} else if (test!='R') { num = parseFloat(val);
if (isNaN(val)) errors+='- '+nm+' must contain a number.\n';
if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
min=test.substring(8,p); max=test.substring(p+1);
if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
} } } else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; }
} if ((errors) || (getherrors))
alert("The following error(s) occurred:\n"+errors+getherrors);
document.MM_returnValue = ((errors == '') && (getherrors == ''));
}
</script>
Now, if you want to validate a dropdown menu too, this code becomes like this. Again, “form1” is the name and id of my form, “agree” is the name and id of my checkbox and “country” is the name of my dropdown. Its first value (the default one) is set to ” “:
<script type="text/javascript">
function MM_validateForm() { //v4.0
if(document.forms["form1"].elements["agree"].checked){
getherrors='';
}
else{ getherrors='- please read the disclaimer and confirm'; }
if(document.forms["form1"].elements["country"].value!=""){
getherrors2='';
}
else{ getherrors2='- please select your country'; }
var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]);
if (val) { nm=val.name; if ((val=val.value)!="") {
if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@');
if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n';
} else if (test!='R') { num = parseFloat(val);
if (isNaN(val)) errors+='- '+nm+' must contain a number.\n';
if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
min=test.substring(8,p); max=test.substring(p+1);
if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
} } } else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; }
} if ((errors) || (getherrors) || (getherrors2))
alert("The following error(s) occurred:\n"+errors+getherrors+"\n"+getherrors2);
document.MM_returnValue = ((errors == '') && (getherrors == '') && (getherrors2 == ''));
}
</script>
I am sure that there are better solutions somewhere, but if it works, it’s ok with me :). Thanks again to Getho from the above mentioned URL for providing the initial code.