fci
09-26-2004, 10:06 PM
<script>
function validator()
{
var v =
{
arrInt : 0,
formName : 0,
nodes : [],
notice : 'alert',
empty : function() { this.setNode(arguments[0],'empty' ); },
email : function() { this.setNode(arguments[0],'email' ); },
form : function() { this.formName = arguments[0]; },
notice : function() { this.notice = arguments[0]; },
setNode : function()
{
this.nodes[this.arrInt] = [ arguments[0], arguments[1] ];
this.arrInt++;
},
phoneArea : function() { this.setNumberNode(arguments[0], 'number', 3 ); },
phonePrefix : function() { this.setNumberNode(arguments[0], 'number', 3 ); },
phoneSuffix : function() { this.setNumberNode(arguments[0], 'number', 4 ); },
zip : function() { this.setNumberNode(arguments[0], 'number', 5 ); },
setNumberNode : function()
{
this.nodes[this.arrInt] = [ arguments[0], arguments[1], arguments[2] ];
this.arrInt++;
},
validate : function ()
{
this.clearNotice();
var total_nodes = this.nodes.length;
for (var i=0; i<total_nodes; i++) {
var obj = document.forms[this.formName].elements[this.nodes[i][0]];
var value = obj.value.trim();
switch (this.nodes[i][1]) {
case 'email' :
var pat = /^[a-z0-9\-\._]+@[a-z0-9\-\.]+\.[a-z]{2,3}$/i;
if (!pat.test(value)) {
this.sendNotice('The email address is invalid');
obj.focus();
return false;
}
break;
case 'empty' :
if (value=='') {
this.sendNotice('The input is empty');
obj.focus();
return false;
}
break;
case 'number' :
var pat = new RegExp('\\d{' + this.nodes[i][2] + '}','');
if (!pat.test(value)) {
this.sendNotice('The input is not a valid number or is not of the correct length');
obj.focus();
return false;
}
break;
}
}
return true;
},
sendNotice : function()
{
switch (this.notice) {
case 'alert' :
alert(arguments[0]);
break;
case 'span' :
document.getElementById('form_catcher').innerHTML = arguments[0];
break;
}
},
clearNotice : function()
{
switch (this.notice) {
case 'span' :
this.sendNotice('');
break;
}
},
}
return v;
}
String.prototype.trim = function()
{
var s = this.replace(/^\s+/,'');
s = s.replace(/\s+$/,'');
return s;
}
yar = new validator();
yar.notice('span'); // if not set defaults to 'alert' notices
yar.form('my_form'); // if not set defaults to forms[0]
yar.email('_email');
yar.zip('_zip');
yar.empty('empty5');
/*
yar.phoneArea(ELEMENT_NAME_ATTRIBUTE);
yar.phonePrefix(ELEMENT_NAME_ATTRIBUTE);
yar.phoneSuffix(ELEMENT_NAME_ATTRIBUTE);
yar.zip(ELEMENT_NAME_ATTRIBUTE);
yar.email(ELEMENT_NAME_ATTRIBUTE);
yar.empty(ELEMENT_NAME_ATTRIBUTE);
*/
</script>
<form name="my_form" method="post" onSubmit="return yar.validate();">
<span id="form_catcher" style="color:#FF0000;"></span>
<Input type="text" value="342" name="area_code">
<Input type="text" value="5555" name="_zip">
<Input type="text" value="asdfasdf@asdf.com" name="_email">
<Input type="text" value="3" name="phone_area">
<Input type="text" value="" name="empty5">
<Input type="submit">
</form>
some known issues but both happy problems..
- the focus() on select/radio/checkbox objects
- needs to be a better way to send notices
also, only tested in Fx.
please criticize, it's not meant to be impressive, just a mix of boredom and playing with inheritance.
function validator()
{
var v =
{
arrInt : 0,
formName : 0,
nodes : [],
notice : 'alert',
empty : function() { this.setNode(arguments[0],'empty' ); },
email : function() { this.setNode(arguments[0],'email' ); },
form : function() { this.formName = arguments[0]; },
notice : function() { this.notice = arguments[0]; },
setNode : function()
{
this.nodes[this.arrInt] = [ arguments[0], arguments[1] ];
this.arrInt++;
},
phoneArea : function() { this.setNumberNode(arguments[0], 'number', 3 ); },
phonePrefix : function() { this.setNumberNode(arguments[0], 'number', 3 ); },
phoneSuffix : function() { this.setNumberNode(arguments[0], 'number', 4 ); },
zip : function() { this.setNumberNode(arguments[0], 'number', 5 ); },
setNumberNode : function()
{
this.nodes[this.arrInt] = [ arguments[0], arguments[1], arguments[2] ];
this.arrInt++;
},
validate : function ()
{
this.clearNotice();
var total_nodes = this.nodes.length;
for (var i=0; i<total_nodes; i++) {
var obj = document.forms[this.formName].elements[this.nodes[i][0]];
var value = obj.value.trim();
switch (this.nodes[i][1]) {
case 'email' :
var pat = /^[a-z0-9\-\._]+@[a-z0-9\-\.]+\.[a-z]{2,3}$/i;
if (!pat.test(value)) {
this.sendNotice('The email address is invalid');
obj.focus();
return false;
}
break;
case 'empty' :
if (value=='') {
this.sendNotice('The input is empty');
obj.focus();
return false;
}
break;
case 'number' :
var pat = new RegExp('\\d{' + this.nodes[i][2] + '}','');
if (!pat.test(value)) {
this.sendNotice('The input is not a valid number or is not of the correct length');
obj.focus();
return false;
}
break;
}
}
return true;
},
sendNotice : function()
{
switch (this.notice) {
case 'alert' :
alert(arguments[0]);
break;
case 'span' :
document.getElementById('form_catcher').innerHTML = arguments[0];
break;
}
},
clearNotice : function()
{
switch (this.notice) {
case 'span' :
this.sendNotice('');
break;
}
},
}
return v;
}
String.prototype.trim = function()
{
var s = this.replace(/^\s+/,'');
s = s.replace(/\s+$/,'');
return s;
}
yar = new validator();
yar.notice('span'); // if not set defaults to 'alert' notices
yar.form('my_form'); // if not set defaults to forms[0]
yar.email('_email');
yar.zip('_zip');
yar.empty('empty5');
/*
yar.phoneArea(ELEMENT_NAME_ATTRIBUTE);
yar.phonePrefix(ELEMENT_NAME_ATTRIBUTE);
yar.phoneSuffix(ELEMENT_NAME_ATTRIBUTE);
yar.zip(ELEMENT_NAME_ATTRIBUTE);
yar.email(ELEMENT_NAME_ATTRIBUTE);
yar.empty(ELEMENT_NAME_ATTRIBUTE);
*/
</script>
<form name="my_form" method="post" onSubmit="return yar.validate();">
<span id="form_catcher" style="color:#FF0000;"></span>
<Input type="text" value="342" name="area_code">
<Input type="text" value="5555" name="_zip">
<Input type="text" value="asdfasdf@asdf.com" name="_email">
<Input type="text" value="3" name="phone_area">
<Input type="text" value="" name="empty5">
<Input type="submit">
</form>
some known issues but both happy problems..
- the focus() on select/radio/checkbox objects
- needs to be a better way to send notices
also, only tested in Fx.
please criticize, it's not meant to be impressive, just a mix of boredom and playing with inheritance.