Zaloguj | Zarejestruj | FAQ
Anonymous

Form Validation Help

+ Odpowiedz

Posty: 10 Strona 1 z 1


Form Validation Help

przez soccerwebsitemaker » Pt mar 02, 2012 6:10 pm

Hi, I'm trying to make a form that validates itself. However, while working on the password validating, I came across a problem. If the password did not match the confirmation password, it displayed a message. But if the password is less than 3 characters or more than 32 characters, it doesn't display the message.



The problem is on the site http://nitigu.net63.net/quizwebsite/qui ... mbers.html.

Also, the JavaScript is here:






onload = init;

function init()

{

var registerUser = document.getElementById("registerUser");

registerUser.onsubmit = validate;

}

function validate()

{

var username = document.getElementById("newusernameinput").value;

var password = document.getElementById("newpasswordinput").value;

var confirmpass = document.getElementById("newpasswordcheckinput").value;

var email = document.getElementById("newemailinput").value;

var confirmemail = document.getElementById("newemailcheckinput").value;

var message = "";

var passMatch = false;

var emailMatch = false;

var emailValid = false;

var passValid = false;

var userValid = false;

//Perfect Situation

if (passMatch && emailMatch && emailValid && passValid && userValid)

{

alert("Thanks for registering!");

}

//Username Validation

//Password Validation

if (confirmpass == password)

{

passMatch = true;

message = "";

writeMessage(message);

return false;

}

else

{

message = "Your password and confirmation password do not match";

writeMessage(message);

return false;

}

if (password.length < 3 || password.length > 32)

{

message = "Your password is too long or too short - must be between 3 and 32 characters";

writeMessage(message);

return false;

}

}

function writeMessage(text)

{

var paragraph = document.getElementById("result");

if (paragraph.firstChild)

{

paragraph.removeChild(paragraph.firstChild);

}

paragraph.appendChild(document.createTextNode(text));

}



Please help.
Avatar użytkownika

soccerwebsitemaker

  • Posty: 138
  • Dołączył(a): So gru 31, 2011 6:25 pm
--
Coins. Profile. Games. Chat. Fun.

CoinAwards.

Check it out at http://www.coinawards.net63.net/

Re: Form Validation Help

przez mariaantonietta » So mar 03, 2012 12:22 pm

Hi,

I tried the registration form on your website (http://nitigu.net63.net/quizwebsite/qui ... mbers.html) and it seems to me that validation is not working at all: I submitted a half empty form, with a wrongly formatted email, empty confirmation boxes and only 2 characters in unsername and password boxes, and I got a successful registration message.

Also, I found that the ids you use in the javascript code are not those used in the html. Perhaps this could be part of the problem.

soccerwebsitemaker napisał(a):Hi, I'm trying to make a form that validates itself. However, while working on the password validating, I came across a problem. If the password did not match the confirmation password, it displayed a message. But if the password is less than 3 characters or more than 32 characters, it doesn't display the message.



The problem is on the site http://nitigu.net63.net/quizwebsite/qui ... mbers.html.

Also, the JavaScript is here:






onload = init;

function init()

{

var registerUser = document.getElementById("registerUser");

registerUser.onsubmit = validate;

}

function validate()

{

var username = document.getElementById("newusernameinput").value;

var password = document.getElementById("newpasswordinput").value;

var confirmpass = document.getElementById("newpasswordcheckinput").value;

var email = document.getElementById("newemailinput").value;

var confirmemail = document.getElementById("newemailcheckinput").value;

var message = "";

var passMatch = false;

var emailMatch = false;

var emailValid = false;

var passValid = false;

var userValid = false;

//Perfect Situation

if (passMatch && emailMatch && emailValid && passValid && userValid)

{

alert("Thanks for registering!");

}

//Username Validation

//Password Validation

if (confirmpass == password)

{

passMatch = true;

message = "";

writeMessage(message);

return false;

}

else

{

message = "Your password and confirmation password do not match";

writeMessage(message);

return false;

}

if (password.length < 3 || password.length > 32)

{

message = "Your password is too long or too short - must be between 3 and 32 characters";

writeMessage(message);

return false;

}

}

function writeMessage(text)

{

var paragraph = document.getElementById("result");

if (paragraph.firstChild)

{

paragraph.removeChild(paragraph.firstChild);

}

paragraph.appendChild(document.createTextNode(text));

}



Please help.
Avatar użytkownika

mariaantonietta

  • Posty: 64
  • Dołączył(a): Pn paź 31, 2011 7:23 pm

Re: Form Validation Help

przez soccerwebsitemaker » N mar 04, 2012 11:26 pm

Well, I found a way to do it. Just make different functions for each thing to validate.
Avatar użytkownika

soccerwebsitemaker

  • Posty: 138
  • Dołączył(a): So gru 31, 2011 6:25 pm
--
Coins. Profile. Games. Chat. Fun.

CoinAwards.

Check it out at http://www.coinawards.net63.net/

Re: Form Validation Help

przez soccerwebsitemaker » Pn mar 05, 2012 11:19 pm

Now I fixed the ID problem, and I proofread the code many times. Still, code is broken. Any way to fix it?




Broken Code:




onload = init;

function init()

{

var registerUser = document.getElementById("registerUser");

registerUser.onsubmit = validateAll;

}

function validateAll()

{

validateUserLength;

validateUserValid;

validatePassLength;

validatePassMatch;

}

function validateUserLength()

{

var username = document.getElementById("username").value;

var password = document.getElementById("password").value;

var confirmpass = document.getElementById("passwordconfirm").value;

var email = document.getElementById("email").value;

var confirmemail = document.getElementById("emailconfirm").value;

var message = "";

if (username.length < 3 || username.length > 32)

{

message = "Please enter a username between 3 and 32 characters.";

writeMessage(message);

return false;

}

else

{

message = "";

writeMessage(message);

return false;

}

}

function validateUserValid()

{

var username = document.getElementById("username").value;

var password = document.getElementById("password").value;

var confirmpass = document.getElementById("passwordconfirm").value;

var email = document.getElementById("email").value;

var confirmemail = document.getElementById("emailconfirm").value;

var message = "";

if (username.indexOf("a") !== -1)

{

message = "";

writeMessage(message);

return false;

}

else

{

message = "No 'a's allowed.";

writeMessage(message);

return false;

}

}

function validatePassMatch()

{

var username = document.getElementById("username").value;

var password = document.getElementById("password").value;

var confirmpass = document.getElementById("passwordconfirm").value;

var email = document.getElementById("email").value;

var confirmemail = document.getElementById("emailconfirm").value;

var message = "";

if (confirmpass == password)

{

passMatch = true;

message = "";

writeMessage(message);

return false;

}

else

{

message = "Your password and confirmation password do not match";

writeMessage(message);

return false;

}

}

function validatePassLength()

{

var username = document.getElementById("username").value;

var password = document.getElementById("password").value;

var confirmpass = document.getElementById("passwordconfirm").value;

var email = document.getElementById("email").value;

var confirmemail = document.getElementById("emailconfirm").value;

var message = "";

if (password.length < 3 || password.length > 32)

{

message = "Your password is too long or too short - must be between 3 and 32 characters";

writeMessage(message);

return false;

}

else

{

writeMessage(message);

return false;

passValid = true;

}

}

function writeMessage(text)

{

var paragraph = document.getElementById("result");

if (paragraph.firstChild)

{

paragraph.removeChild(paragraph.firstChild);

}

paragraph.appendChild(document.createTextNode(text));

}






Thanks
Avatar użytkownika

soccerwebsitemaker

  • Posty: 138
  • Dołączył(a): So gru 31, 2011 6:25 pm
--
Coins. Profile. Games. Chat. Fun.

CoinAwards.

Check it out at http://www.coinawards.net63.net/

Re: Form Validation Help

przez mariaantonietta » Wt mar 06, 2012 12:01 pm

Hi,

I haven't tried out your code, but at first sight it looks like you didn't call your functions. Instead of:

Kod: Zaznacz cały
function validateAll()

{

validateUserLength;

validateUserValid;

validatePassLength;

validatePassMatch;

}


Try doing:

Kod: Zaznacz cały
function validateAll()

{

validateUserLength();

validateUserValid();

validatePassLength();

validatePassMatch();

}


If you leave out the round brackets, you're not calling your functions. These means that they're not being activated and therefore they can't do their job.
Avatar użytkownika

mariaantonietta

  • Posty: 64
  • Dołączył(a): Pn paź 31, 2011 7:23 pm

Re: Form Validation Help

przez soccerwebsitemaker » Śr mar 07, 2012 1:30 am

I fixed the brackets problem, even in the init function. Unfortunately, this doesn't seem to fix the problem. Any other errors that you've found, please notify me. Thanks.
Avatar użytkownika

soccerwebsitemaker

  • Posty: 138
  • Dołączył(a): So gru 31, 2011 6:25 pm
--
Coins. Profile. Games. Chat. Fun.

CoinAwards.

Check it out at http://www.coinawards.net63.net/

Re: Form Validation Help

przez XainPro » Wt mar 13, 2012 5:17 pm

You should use this code at the end of your function

if (passMatch && emailMatch && emailValid && passValid && userValid)

{

alert("Thanks for registering!");

}
Avatar użytkownika

XainPro

  • Posty: 3933
  • Dołączył(a): Pt lut 17, 2012 8:10 pm

Re: Form Validation Help

przez soccerwebsitemaker » Wt mar 20, 2012 12:29 am

I tried adding that code, but it didn't work still.
Avatar użytkownika

soccerwebsitemaker

  • Posty: 138
  • Dołączył(a): So gru 31, 2011 6:25 pm
--
Coins. Profile. Games. Chat. Fun.

CoinAwards.

Check it out at http://www.coinawards.net63.net/

Re: Form Validation Help

przez XainPro » N mar 25, 2012 9:04 am

why don'y you use ready made solution of jquery for form validation
http://docs.jquery.com/Plugins/Validation
its easy to understand you have to code less and it provide very good functionality.
Avatar użytkownika

XainPro

  • Posty: 3933
  • Dołączył(a): Pt lut 17, 2012 8:10 pm

Re: Form Validation Help

przez Mister_grey2010 » Cz paź 04, 2012 2:46 am

To validate text fields use the regular expressions. To validate email field try to do this http://web-design-lessons.com/articles/article/1/JavaScript%20Browser%20Detection
Avatar użytkownika

Mister_grey2010

  • Posty: 22
  • Dołączył(a): Śr sty 04, 2012 6:44 pm


+ Odpowiedz

Strona 1 z 1

cron