Form validation script

[Divinite]

I have this basic script that I'm working with to require fields on a form...however, it's not working properly.

The required fields are name and email, and the OnClick on the submit is supposed to alert and stop the script from processing further if they're not filled in. However, what it is actually doing is alerting the message then processing the script anyway. I can't figure out what's wrong with it!

Here's the code:

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function verify() {
var themessage = "You are required to complete the following fields: ";
if (document.subscribe.names.value=="") {
themessage = themessage + " - Name";
}
if (document.subscribe.email.value=="") {
themessage = themessage + " - E-mail";
}
//alert if fields are empty and cancel form submit
if (themessage == "You are required to complete the following fields: ") {
return false;
//document.subscribe.submit();
}
else {
alert(themessage);
return false;
}
}
// End -->
</script>

....................................and the form.................

<form action="processmail.php" method="post" name="subscribe" id="subscribe">

<p>Name<br>
<input type="text" name="names" maxlength="50">
<br>
Email<br>
<input type="text" name="email" maxlength="50"><br>
<input type="radio" name="subscrib" value="Sub" checked><b>Subscribe</b> &nbsp;&nbsp; <input type="radio" name="subscrib" value="Un"><b>Unsubscribe</b><br>
<input type="submit" name="subscribe_submit" id="subscribe_submit" value="Subscribe" class="button" onClick="verify();"></p>
</form>

Thanks!!

[Dan Drillich]

Please change the form to -


<form action="processmail.php" method="post" name="subscribe" id="subscribe" onsubmit="return verify()">

<p>Name<br>
<input type="text" name="names" maxlength="50">
<br>
Email<br>
<input type="text" name="email" maxlength="50"><br>
<input type="radio" name="subscrib" value="Sub" checked><b>Subscribe</b> <input type="radio" name="subscrib" value="Un"><b>Unsubscribe</b><br>
<input type="submit" name="subscribe_submit" id="subscribe_submit" value="Subscribe" class="button"></p>
</form>

[AdamGundry]

I'm guessing the problem is because you are calling verify() from the submit button's onClick hander, not the form's onSubmit. Use this form tag instead, and remove the reference in onClick:

<form action="processmail.php" method="post" name="subscribe" id="subscribe" onSubmit="verify();">

Also keep in mind that this may fail, so you may need to repeat the validation server-side (the user could have Javascript disabled).

Adam

[Divinite]

Changed the form to onSubmit="return verify()";

Worked in part....it isn't submitting now when there isn't info there...however, it's not submitting when there is info there either. It doesn't pop up the message...but it's not actually doing anything...

Tried the other suggestion...just using onSubmit="verify()" and that left me with the same results as before...bringing up the message but still submitting the form.

Any ideas to get the first suggestion to actually submit the form now?

Thanks!

[Dan Drillich]

Please replace the function verify with -

function verify() {
var valid = true;
var themessage = "You are required to complete the following fields: ";

if (document.subscribe.names.value=="") {
themessage = themessage + " - Name";
valid = false;
}

if (document.subscribe.email.value=="") {
themessage = themessage + " - E-mail";
valid = false;
}

if (valid == false) {
alert(themessage);
}

return valid;
}

[Divinite]

Thank you very much!

That worked!