Gossamer Forum
Home : General : Perl Programming :

Simple JS Qn

Quote Reply
Simple JS Qn
I've written a bit of JS to validate some form fields (Im a JS newbie) but it keeps submitting the form after the errors are displayed. Could someone tell me how to stop that? I thought using return false would do it :(

Code:
<script language="Javascript1.2">

function validate() {
var msg = "Please fill in the following fields: ";
if (document.contact.Full_Name.value == "") {
msg = msg + "Full Name, "
}
if (document.contact.Email_Address.value == "") {
msg = msg + "Email Address, "
}
if (document.contact.Comments.value == "") {
msg = msg + "Comments"
}

if (msg == "Please fill in the following fields: ") {
document.contact.submit();
}
else {
alert(msg);
return false;
}
}

</script>

....then:

<input type="submit" value="Send" onclick="validate();">

Thanks.

Last edited by:

RedRum: Feb 3, 2002, 11:40 AM
Quote Reply
Re: [RedRum] Simple JS Qn In reply to
Doh!

I needed to use input type="button" not input type="submit"
Quote Reply
Re: [RedRum] Simple JS Qn In reply to
Actually, cleaner codes that you can use are like the following:

Quote:

function nameoffunction(form) {
if (form.Username.value == "") {
alert("Please enter your USERNAME.")
form.Username.focus ()
return false;
}
if (form.Password.value == "") {
alert("Please enter your PASSWORD.")
form.Password.focus ()
return false;
}
if (form.VerifyPassword.value == "") {
alert("Please verify your PASSWORD.")
form.VerifyPassword.focus ()
return false;
}
if (form.VerifyPassword.value != form.Password.value) {
alert("Your PASSWORD does not match. Try again.")
form.VerifyPassword.focus ()
return false;
}
return true;
}


Then in your web form, simply add the following attribute to your form action tag:

Quote:

onSubmit="return nameoffunction(this)"


Example:

http://www.hpsfaa.org/bin/secure/
========================================
Buh Bye!

Cheers,
Me
Quote Reply
Re: [Heckler] Simple JS Qn In reply to
Thanks, but I'd already re-written the code as I knew it wasn't very good. Also that code above will only show one error at a time which isn't what I want.

Last edited by:

RedRum: Feb 4, 2002, 2:15 AM
Quote Reply
Re: [RedRum] Simple JS Qn In reply to
Showing an array of errors in an alert box is not very user-friendly if you ask me. Also, the codes above will take the user back to the field in question to help them identify which fields they need to fill in.
========================================
Buh Bye!

Cheers,
Me
Quote Reply
Re: [Heckler] Simple JS Qn In reply to
>>Showing an array of errors in an alert box is not very user-friendly if you ask me. <<

I consider it more user friendly than popping up one error at a time which is very annoying.

Last edited by:

RedRum: Feb 4, 2002, 8:07 AM
Quote Reply
Re: [RedRum] Simple JS Qn In reply to
You may, but your users may find it annoying that you list a bunch of problems in one alert box, then showing a clean message based on the exact field that is in question. Also, in terms of accessibility (like for visually and physically impaired computer users), it is better to "point" out or refer the user to the field in question (with appropriate label and id attributes), rather than throwing up an ambiguous box with a bunch of errors printed in it.
========================================
Buh Bye!

Cheers,
Me

Last edited by:

Heckler: Feb 4, 2002, 8:01 AM