JavaScript form validation: probs. with event handling...

[Osaurus]

Hi all,

I`m pulling my hair out over some JavaScript form validation that probably has a simple solution (if only I knew it ha!). I have 5 text boxes that are being validated in the first instance and the validation code can be seen below.

It all works fine up to the point where the E-mail text box is validated. The script recognises a lack of any data and invalid e-mails but after that I cannot seem to get the focus to pass onto the next text box and the whole thing locks up - no form submission can take place. I know that the value of true is returned if its ok to submit; false if it isn't. Can anyone point me in the right direction here - it would be greatly appreciated!


Here is the relevent <FORM> tag:

<form method="post" name="security01" action="register_new.asp" onSubmit="return checkform(this)">


A working(!) example can be found here (take no notice of all the checkboxes - these need to be validated at some point and in the first line they have been):

http://www.osaurus.org/lm_admin/register.asp


This is the JavaScript code which is a SSI:

// Check normal text fields...
function checkform (form)
{
if (form.title.value == "") {
alert( "Please enter your title." );
form.title.focus();
return false ;
}

if (form.first_name.value == "") {
alert( "Please enter your first name." );
form.first_name.focus();
return false ;
}

if (form.second_name.value == "") {
alert( "Please enter your second name." );
form.second_name.focus();
return false ;
}

if (form.email.value == "") {
alert( "Please enter a valid E-mail address. This may be used by London Management only, in case of verification and contact." );
form.email.focus();
return false ;
}

if (form.email.value.length > 0) {
var Temp = document.security01.email
var AtSym = Temp.value.indexOf('@')
var FullStop = Temp.value.lastIndexOf('.')
var Space = Temp.value.indexOf(' ')
var Length = Temp.value.length - 1 // Array is from 0 to length-1

if ((AtSym < 1) || // Must be something before '@'
(FullStop <= AtSym+1) || // Must be at least 1 valid char between '@' and '.'
(FullStop == Length ) || // Must be at least 1 valid char after '.'
(Space != -1)) // No empty spaces

alert('There is a problem with the validity of your E-mail address!');
form.email.focus();
return false ;
}


if (form.lo_ch_first.value == "") {
alert( "Please enter a Lodge/Chapter No. in the first field marked with an asterisk." );
form.lo_ch_first.focus();
return false ;
}

return true ;
}

[Jon Hanlon]

Missing a brace.


if (form.email.value.length > 0) {
var email = form.email
var AtSym = email.value.indexOf('@')
var FullStop = email.value.lastIndexOf('.')
var Space = email.value.indexOf(' ')
var Length = email.value.length - 1 // Array is from 0 to length-1
if ((AtSym < 1) || // Must be something before '@'
(FullStop <= AtSym+1) || // Must be at least 1 valid char between '@' and '.'
(FullStop == Length ) || // Must be at least 1 valid char after '.'
(Space != -1)) { // No empty spaces
alert('There is a problem with the validity of your E-mail address!');
form.email.focus();
return false ;
}
}

[Osaurus]

Thanks for looking at my code Jon! I nearly kicked myself when it seemed like `missing brace syndrome` but this doesn`t seem to be the case unfortunately. There are only two braces (opening and closing) in this block that I can see :-(

Note that the text box `email` is checked twice overall - once for being empty and then for having an invalid address. It functions fine doing this and the validation of this text box seems to finish okay when a proper e-mail address is entered.

However, the focus stays on this `email` text box and doesn`t move on to the next final one `lo_ch_first`. Not only that but the overall validation at this point has evidently returned `false` as no further progress by the user is possible. Non-programmatically speaking (& I don`t know a lot of JavaScript) it seems that validation has stopped at this point with no possibility of returning `true` - a dead-end?

Please have a look at the online version to see this clearer - I bet it is something simple like the braces problem but I`ve spent hours(!) trying to fathom it to no avail :-(

Thanks everyone!

Nick

[Osaurus]

Hi again Jon,

So much for all that nonsense I just wrote ;-)

Yes, you`re quite right - missing braces (aren`t they such a pain in Javascript, hehe!). I didn`t notice the one you had highlighted in bold at:

(Space != -1)) { // No empty spaces

Everything sems to work fine now! Thanks a lot. I`m off to give myself a nice big slap round the head somewhere quiet... ;-)

Nick

[Jon Hanlon]

I probably should have made it red or blue.