Solved

500 points --- Compare password & retype password field validation???

Posted on 2004-10-09
21
836 Views
Last Modified: 2008-02-01
Hi,

I have a password and retype password field. I want the form to submit only when they both are same. I am already calling field level validtions on Form OnSubmit.

So please provide me the way to validate both pwd fields and from where to call the function. I think that the submit button would be a good place from where on clicking the functions is called to check both pwd fields and if not same, an alert window will appear and the form is not submitted.

Need it fast... so 500 points for this question.

Thanks,
Khurram.
0
Comment
Question by:khurram007
  • 7
  • 7
  • 4
  • +1
21 Comments
 
LVL 2

Expert Comment

by:mag1c1an
Comment Utility
Hi,
Since i dont really know the contents of your html page, I am just writing the function below, it is pretty easy to understand, give me a shout if you dont understand anything or run into problems:

<SCRIPT LANGUAGE="JavaScript">
function CheckPassword()
{
 var Password, ConfPassword, Result;
 Password = document.frmRegistration.txtPassword.value;
 ConfPassword = document.frmRegistration.txtConfirmPass.value;
 Result = document.frmRegistration.txtResult;
 if(Password == ConfPassword)
   Result.value = "Congratulations - Account Created";
 else
   Result.value = "Your Passwords Do Not Match";
}
</SCRIPT>

-Mag
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
function checkPassword(form) {
  if(form.password.value == form.retypePassword.value) {
    return true;
  } else {
    alert("Your need to type the same password in both boxes.");
    return false;
  }
}

call it in the submit button on onSubmit. To use with your other validation functions use:

onSubmit="validate() && checkPassword(this.form)"

where validate() is your field validation function.

Alternately you could just add the checkPassword code to your validation function.
0
 
LVL 2

Expert Comment

by:mag1c1an
Comment Utility
A few notes:
The above assumes that your form name is
"frmRegistration"
and that the first password field is
"txtPassword"
and the confirmation password field is
"txtConfirmPass"

This part you will need to change if you want an alert:
if(Password == ConfPassword)
   Result.value = "Congratulations - Account Created";
 else
   Result.value = "Your Passwords Do Not Match";



change to:
if(Password != ConfPassword)
   alert ("Congratulations - Account Created");


(Not tested, but should work)

Mag
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility
Well honestly I am not good in Javascript... so want to have something ready to cut and paste. lol

here is my html.

<table>
    <tr>
         <td>
                 <font face="Verdana" size="2">Password*</font></td>
         <td>
                <input type="password" class="frmText" name="pwd" /></td>
    </tr>
 <tr>
         <td>
               <font face="Verdana" size="2">Retype Password*</font></td>
         <td>
               <input type="password" class="frmText" name="pwd2"  /></td>
    </tr>
 <tr>
         <td>
              <input type="submit" class="frmButton" name="Submit" value="Register"/></td>
    </tr>
<table>
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
Change your submit button code to as follows:
<input type="submit" class="frmButton" name="Submit" value="Register" onSubmit="return this.form.pwd.value == this.forn.pwd2.value"/></td>

You may have some trouble with your tables. Consider rewriting using <fieldset>s and <label>s
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility
Form name is frmRegister. I have tried this and its not working... What am I doing wrong???

<SCRIPT LANGUAGE="JavaScript">
function CheckPassword()
{
 var Password, ConfPassword, Result;
 Password = document.frmRegister.pwd.value;
 ConfPassword = document.frmRegister.pwd2.value;
 Result = document.frmRegister.txtResult;
 if(Password != ConfPassword)
   alert ("Passwords don't match - Try again!");
}
</SCRIPT>

   <input type="submit" class="frmButton" name="Submit" value="Register" onclick="CheckPassword()"/>
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
get rid of the Result = ...; line.
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility
Ok,

Its work like a charm. But the form is still submitting. I want to stop submitting in case of alert. I have already added

return false;

but no difference.
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
Just use this function instead, it's slightly simpler:

 function checkPassword(form) {
  if(form.pwd.value == form.pwd2.value) {
    return true;
  } else {
    alert("Your need to type the same password in both boxes.");
    return false;
  }
}

<input type="submit" class="frmButton" name="Submit" value="Register" onSubmit="return checkPassword(this.form)"/>
0
 

Expert Comment

by:joke5ter
Comment Utility
oops, I am not getting a email when theres a reply here :-( will check into it and get back to you in a few mins..
0
Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 

Expert Comment

by:joke5ter
Comment Utility
Ok, solved:


<SCRIPT LANGUAGE="JavaScript">
function CheckPassword()
{
 var Password, ConfPassword, Result;
 Password = document.frmRegister.pwd.value;
 ConfPassword = document.frmRegister.pwd2.value;
 Result = document.frmRegister.txtResult;
if(Password == ConfPassword)
return true;
else
alert ("Passwords don't match - Try again!");
return false;
}
</SCRIPT>



<form name="frmRegister">
<table>
  <tr>
     <td>
         <font face="Verdana" size="2">Password*</font></td>
     <td>
        <input type="password" class="frmText" name="pwd" /></ td>
  </tr>
 <tr>
     <td>
        <font face="Verdana" size="2">Retype Password*</font></ td>
     <td>
        <input type="password" class="frmText" name="pwd2"  /></ td>
  </tr>
 <tr>
     <td>
  <input type="submit" class="frmButton" name="Submit" value="Register" onclick="return  CheckPassword()"/>

</td>
  </tr>
<table>
</form>
0
 

Expert Comment

by:joke5ter
Comment Utility
Oops, this is my old account that I used, please award the points to my new account of mag1c1an

Thanks,
Mag
0
 
LVL 2

Accepted Solution

by:
mag1c1an earned 500 total points
Comment Utility
So heres the solution again:

<SCRIPT LANGUAGE="JavaScript">
function CheckPassword()
{
 var Password, ConfPassword, Result;
 Password = document.frmRegister.pwd.value;
 ConfPassword = document.frmRegister.pwd2.value;
 Result = document.frmRegister.txtResult;
if(Password == ConfPassword)
return true;
else
alert ("Passwords don't match - Try again!");
return false;
}
</SCRIPT>



<form name="frmRegister">
<table>
  <tr>
     <td>
         <font face="Verdana" size="2">Password*</font></td>
     <td>
        <input type="password" class="frmText" name="pwd" /></ td>
  </tr>
 <tr>
     <td>
        <font face="Verdana" size="2">Retype Password*</font></ td>
     <td>
        <input type="password" class="frmText" name="pwd2"  /></ td>
  </tr>
 <tr>
     <td>
  <input type="submit" class="frmButton" name="Submit" value="Register" onclick="return

CheckPassword()"/>

</td>
  </tr>
<table>
</form>
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
Again that won't work because there's no 'result' textbox anywhere. It'll throw an error.
And you should ask somewhere to have one account deleted, you're not allowed two accounts.
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility
Perfect!!!

Its working perfectly... I have a little question more... I hope you will not mind it...

I have same retype validation needed on the email fields also on the same form. I have modify the function for it. But can u tell me how to call 2 functions on a single on_click event of submit button?

I have tried this, but its not working.... Please answer here... If u want I will start another question and issue u points there.

Thanks,
Khurram.
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
onSubmit = "return checkPassword(this.form) && checkEmail(this.form)"

...said in my original response.
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility

<input type="submit" class="frmButton" name="Submit" value="Register" onclick="return checkPassword(this.form) && checkEmail(this.form)" />

Not working!!!
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility
I don't think its good to ask another question here... So I have issued 500 points for the next one... Hope to see u all there too...

Here is the new question...

http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_21162192.html

Khurram.
0
 
LVL 13

Expert Comment

by:StormyWaters
Comment Utility
Sorry, I was assuming you were using my functions.
0
 
LVL 2

Author Comment

by:khurram007
Comment Utility
No problem...

Cheers...

Khurram.
0
 
LVL 2

Expert Comment

by:mag1c1an
Comment Utility
Yeah sorry, I lost the pass to one of my accounts and my mailbox was dead so i couldnt use the reminder...anyway, long story short, a new mail box and a new id and here i am...now i got my old mailbox back..i logged in to check things out.
I dont want to delete the old account coz i have a couple of answers there in the history...deleteing that will lose that.

Cheers,
Mag
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now