View Full Version : rudimentary empty field validator
<script type="text/javascript"><!--
function Validate_form(form) {
var fields = [];
this.add = function(element, err) {
if ( !('__validate' in form[element]) ) {
form[element].__validate = function() {
if (this.value=='') {
alert(err);
this.focus();
return false;
}
}
}
fields.push(form[element]);
}
this.check = function() {
var len = fields.length;
for (var i=0; i<len; i++)
if ( !fields[i].__validate() )
return false;
return true;
}
}
function form_onsubmit(form) {
var vform = new Validate_form(form);
vform.add('domain_name', 'The domain field is empty');
return(vform.check());
}
--></script>
<form name="signup" method="post" action="" onsubmit="return form_onsubmit();">
<input type="text" name="domain_name" />
<input type="submit" />
</form>
This is nothing special. just a basic empty field validator. it's probably not as efficient as it could be because it assigns the function to the various elements. It also only supports text fields. I was thinking of allowing a 3rd argument on Validate_form.add to accept something like Validate_form.stock.email/number/etc (functions). ah well..
an updated version with the added 'feature' I described in the opening post.
function Validate_form(form) {
var fields = [];
this.add = function(element, err, action) {
if (typeof(action)== 'undefined')
action = Validate_form.stock.empty;
if ( !('__validate' in form[element]) ) {
form[element].__validate = function() {
if (!action(this.value)) {
alert(err);
this.focus();
return false;
}
return true;
}
}
fields.push(form[element]);
}
this.check = function() {
var len = fields.length;
for (var i=0; i<len; i++)
if ( !fields[i].__validate() )
return false;
return true;
}
}
Validate_form.stock = {
empty: function(val) {
return(val!='')
},
email: function(val) {
var pat = /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/i;
return(pat.test(val));
}
}
function form_onsubmit(form) {
var vform = new Validate_form(form);
vform.add('from', 'The From field is empty');
vform.add('from', 'Invalid From address', Validate_form.stock.email);
return(vform.check());
}
made some changes, it's probably a little buggy(haven't done as much testing), and i'll eventually switch around the usage of __validate since using it is unnecessary
function Validate_form(form) {
var fields = [];
this.add = function(element, err, action) {
if (typeof(action)== 'undefined')
action = Validate_form.stock.empty;
if ( !('__validate' in form[element]) ) {
form[element].__validate = function() {
if (!action(getValue(this))) {
alert(err);
if ('focus' in this)
this.focus();
return false;
}
return true;
}
}
fields.push(form[element]);
}
this.check = function() {
var len = fields.length;
for (var i=0; i<len; i++)
if ( !fields[i].__validate() )
return false;
return true;
}
}
function getValue(obj) {
switch(obj.tagName.toLowerCase()) {
default :
case 'input' :
switch (obj.type) {
case 'text' :
case 'checkbox' :
return(obj.value);
break;
case 'radio' :
var len = obj.length;
for (var i=0; i<len; i++) {
if (obj[i].checked)
return(obj[i].value)
}
return('');
break;
}
break;
case 'select' :
return(obj.options[obj.selectedIndex].value);
break;
case 'textarea' :
return(obj.value);
break;
}
}
Validate_form.stock = {
empty: function(val) {
return(val!='')
},
email: function(val) {
var pat = /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/i;
return(pat.test(val));
},
number: function(val) {
var pat = /^\d+$/;
return(pat.test(val));
},
ssn: function(val) {
var pat = /^\d{3}-\d{2}-\d{4}$/;
return(pat.test(val));
}
}
function form_onsubmit(form) {
var vform = new Validate_form(form);
vform.add('name', 'The Name field is empty');
vform.add('phone', 'The Phone field is empty');
vform.add('address', 'The Address field is empty');
vform.add('email', 'Invalid Email address', Validate_form.stock.email);
vform.add('ssn', 'Invalid Social Security #, please use the format 123-45-6789', Validate_form.stock.ssn);
return(vform.check());
}
ah, yes, I knew there'd by bugs, here is a hopefully improved getValue function:
function getValue(obj) {
if ('type' in obj
&& (obj.type.toLowerCase()=='text' || obj.type.toLowerCase()=='checkbox')) {
return(obj.value);
} else if ('options' in obj) {
return(obj.options[obj.selectedIndex].value);
} else if ('tagName' in obj && obj.tagName.toLowerCase()=='textarea') {
return(obj.value);
} else if ('length' in obj) {
var len = obj.length;
for (var i=0; i<len; i++) {
if (obj[i].checked)
return(obj[i].value)
}
}
return('');
}
..(if anyone can link me to something else that is similar to the above, feel free, esp if you know of something better)
vBulletin® v3.8.2, Copyright ©2000-2012, Jelsoft Enterprises Ltd.