PDA

View Full Version : Form validation



aka Robbie
02-19-2007, 02:10 PM
As someone who is just getting into JS I am driving myself potty with this one.

I have the following in place which just checks to make sure that the form fileds have entries. The html code I have cut down to the minimum.


<SCRIPT LANGUAGE="JavaScript">
var empty = new Image(); empty.src = "/images/forms/required_fields/blankimage.gif";

var haveerrors = 0;
function showImage(imagename, imageurl, errors) {
document[imagename].src = imageurl;
if (!haveerrors && errors) haveerrors = errors;
}

function validateForm(f) {
haveerrors = 0;
(f.fullname.value.length < 5) // validate full name length
? showImage("fullnameerror", "fieldempty_fullname.png", true)
: showImage("fullnameerror", "blankimage.gif", false);

(f.company.value.length < 1) // validate job title length
? showImage("companyerror", "fieldempty_companyname.png", true)
: showImage("companyerror", "blankimage.gif", false);

(f.title.value.length < 1) // validate company name length
? showImage("titleerror", "fieldempty_position.png", true)
: showImage("titleerror", "blankimage.gif", false);

(f.email.value.length <5 ) // validate email length
? showImage("emailerror", "fieldempty_email.png", true)
: showImage("emailerror", "blankimage.gif", false);

(f.phone.value.length < 5) // validate phone number length
? showImage("phoneerror", "fieldempty_telephonenumber.png", true)
: showImage("phoneerror", "blankimage.gif", false);

return (!haveerrors);
}
</script>


<form onSubmit="return validateForm(this); ">
<input name="email" type="text" class="focus" id="email" size="40" /><br>
<img src="blankimage.gif" name=emailerror>


What I would like to do is add some form of email validation like the one here:
http://www.dynamicdrive.com/dynamicindex16/emailvalidate.htm

Or one like this (so that I could stop ones like a@a.com and abc@xyz.com):
http://www.javascriptkit.com/script/script2/acheck2.shtml

The ideal outcome would be that if a user does not enter any characters I can display a "please enter email address" image/message (not alert) and if they enter a silly email address then I can display a "please enter valid email address" image.

Whilst I can get any of the scripts to work well independently I am having problems combining a couple as I am not that good with JS yet.

Any help would be great.

aka Robbie
03-02-2007, 01:05 PM
Anyone? :confused: