SMC
07-03-2007, 09:21 PM
Hello everyone I'm having a problem with my Javascript. If something is wrong it reports all the errors just as it should be and returns false. However if everything is correct it does nothing, just refreshes the page. I added an alert towards the bottom and confirmed the function returns true. Is there something in here that would stop it from posting?
Here is the form tag:
<form id="register_form" action = "<?php echo $_SERVER['PHP_SELF'] ?>" method = "post" enctype="multipart/form-data" onsubmit="return validateForm( this );">
And the rather long function, I apologize but I cannot find an error to condense it:
function validateForm( form ){
form.register.disabled = true;
document.getElementById( 'loading' ).style.display = "block";
document.getElementById( 'register_button' ).style.display = "none";
document.getElementById( 'error_display' ).style.display = "none";
document.getElementById("errorText").innerHTML = "";
document.getElementById("alertIcon").innerHTML = "<img src=\"/images/home/alert_icon.png\" alt=\"Error!\" />";
var clearSpanArray = new Array( "usernameSpan", "passwordSpan", "emailSpan", "verify_passwordSpan", "dateofbirthSpan" );
for ( x in clearSpanArray ){
document.getElementById( clearSpanArray[x] ).style.color = "#000000";
document.getElementById( clearSpanArray[x] ).style.fontWeight = "normal";
}
var FormValid = true;
var spanArray = new Array();
var field = form.username.value;
if( field.length > 14 || field.length < 3 ){
document.getElementById("errorText").innerHTML += "<br />• Your username must be between 3 and 14 characters";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "usernameSpan" );
FormValid = false;
}
var field = form.email.value;
var AtPos = field.indexOf("@");
var StopPos = field.lastIndexOf(".");
if( ( field == "" ) || ( AtPos == -1 ) || ( StopPos == -1 ) || ( StopPos < AtPos ) || ( (StopPos - AtPos) == 1 ) ){
document.getElementById("errorText").innerHTML += "<br />• Your e-mail is not valid";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "emailSpan" );
FormValid = false;
}
var illegalChars = new Array( "!", "@", "#", "$", "%", "^", "&", "*", "(", ")", "\"", "\'", "\\", ">", ",", ".", "/", "-", "=", "?", ";" );
var field = form.password.value;
var password = form.password.value;
var verify_password = form.verify_password.value;
var passwordError = false;
if( field.length > 16 || field.length < 5 ){
document.getElementById("errorText").innerHTML += "<br />• Your password must be between 5 and 16 characters";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "passwordSpan" );
FormValid = false;
passwordError = true;
}
for ( x in illegalChars ){
if ( field.indexOf( illegalChars[x] ) != -1 ){
document.getElementById("errorText").innerHTML += "<br />• Your password cannot contain symbols";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "passwordSpan" );
FormValid = false;
passwordError = true;
break;
}
}
if( password != verify_password ){
document.getElementById("errorText").innerHTML += "<br />• Your passwords do not match";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "passwordSpan" );
spanArray.push( "verify_passwordSpan" );
FormValid = false;
passwordError = true;
}
var field = form.year.value;
if( field.length != 4 || !isNumeric( field ) ){
document.getElementById("errorText").innerHTML += "<br />• Please enter your birthday";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "dateofbirthSpan" );
FormValid = false;
}
if( passwordError = true ){
form.password.value = "";
form.verify_password.value = "";
}
if( FormValid == false ){
form.register.disabled = false;
document.getElementById( 'error_display' ).style.display = "block";
document.getElementById( 'loading' ).style.display = "none";
document.getElementById( 'register_button' ).style.display = "block";
scroll(0,0);
for ( x in spanArray ){
document.getElementById( spanArray[x] ).style.color = "#ff0000";
document.getElementById( spanArray[x] ).style.fontWeight = "bold";
}
}
alert( FormValid );
return FormValid;
}
Here is the form tag:
<form id="register_form" action = "<?php echo $_SERVER['PHP_SELF'] ?>" method = "post" enctype="multipart/form-data" onsubmit="return validateForm( this );">
And the rather long function, I apologize but I cannot find an error to condense it:
function validateForm( form ){
form.register.disabled = true;
document.getElementById( 'loading' ).style.display = "block";
document.getElementById( 'register_button' ).style.display = "none";
document.getElementById( 'error_display' ).style.display = "none";
document.getElementById("errorText").innerHTML = "";
document.getElementById("alertIcon").innerHTML = "<img src=\"/images/home/alert_icon.png\" alt=\"Error!\" />";
var clearSpanArray = new Array( "usernameSpan", "passwordSpan", "emailSpan", "verify_passwordSpan", "dateofbirthSpan" );
for ( x in clearSpanArray ){
document.getElementById( clearSpanArray[x] ).style.color = "#000000";
document.getElementById( clearSpanArray[x] ).style.fontWeight = "normal";
}
var FormValid = true;
var spanArray = new Array();
var field = form.username.value;
if( field.length > 14 || field.length < 3 ){
document.getElementById("errorText").innerHTML += "<br />• Your username must be between 3 and 14 characters";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "usernameSpan" );
FormValid = false;
}
var field = form.email.value;
var AtPos = field.indexOf("@");
var StopPos = field.lastIndexOf(".");
if( ( field == "" ) || ( AtPos == -1 ) || ( StopPos == -1 ) || ( StopPos < AtPos ) || ( (StopPos - AtPos) == 1 ) ){
document.getElementById("errorText").innerHTML += "<br />• Your e-mail is not valid";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "emailSpan" );
FormValid = false;
}
var illegalChars = new Array( "!", "@", "#", "$", "%", "^", "&", "*", "(", ")", "\"", "\'", "\\", ">", ",", ".", "/", "-", "=", "?", ";" );
var field = form.password.value;
var password = form.password.value;
var verify_password = form.verify_password.value;
var passwordError = false;
if( field.length > 16 || field.length < 5 ){
document.getElementById("errorText").innerHTML += "<br />• Your password must be between 5 and 16 characters";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "passwordSpan" );
FormValid = false;
passwordError = true;
}
for ( x in illegalChars ){
if ( field.indexOf( illegalChars[x] ) != -1 ){
document.getElementById("errorText").innerHTML += "<br />• Your password cannot contain symbols";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "passwordSpan" );
FormValid = false;
passwordError = true;
break;
}
}
if( password != verify_password ){
document.getElementById("errorText").innerHTML += "<br />• Your passwords do not match";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "passwordSpan" );
spanArray.push( "verify_passwordSpan" );
FormValid = false;
passwordError = true;
}
var field = form.year.value;
if( field.length != 4 || !isNumeric( field ) ){
document.getElementById("errorText").innerHTML += "<br />• Please enter your birthday";
document.getElementById("alertIcon").innerHTML += "<br />";
spanArray.push( "dateofbirthSpan" );
FormValid = false;
}
if( passwordError = true ){
form.password.value = "";
form.verify_password.value = "";
}
if( FormValid == false ){
form.register.disabled = false;
document.getElementById( 'error_display' ).style.display = "block";
document.getElementById( 'loading' ).style.display = "none";
document.getElementById( 'register_button' ).style.display = "block";
scroll(0,0);
for ( x in spanArray ){
document.getElementById( spanArray[x] ).style.color = "#ff0000";
document.getElementById( spanArray[x] ).style.fontWeight = "bold";
}
}
alert( FormValid );
return FormValid;
}