easy password match mod

[durangod]

I worked up an easy password match mod. I am using portal and comparison. Turned out pretty good.

 

It allows the person registering creating an account on view cart to see if the passwords match before they process the form.

 

I will share here, if you care to make it better, please keep sharing thanks...

 

First here is the clientregister.tpl mod and then ill post the view cart in a bit when im sure its ok.

 

 

For the client register tpl you already have a great space for the match which works great. Right under the pw strength display. Here is what it looks like.

 

see image for screen shots. As soon as they leave (exit) the confirm password box and click anywhere else, it will show the result.

 

 

here is the js code

 

{literal}
<script type="text/javascript">

function checkpwmatch()
{
var first = document.subregfrm.newpw.value;
var second = document.subregfrm.password2.value;

if(first === second)
{
 mesg = '<span style="color:#109710;">✔Passwords Match</span>';
 document.getElementById('checkmatchresult').innerHTML=mesg;  

 }else{
      mesg = '<span style="color:#8e1122;">✘ Passwords Do Not Match</span>';
      document.getElementById('checkmatchresult').innerHTML=mesg;      
      }

}//close function checkpwmatch

</script>
{/literal}

 

 

here is the rest of it

 

the form by default does not have a name so you will need to add it..

 

<!-- orig code
<form method="post" action="{$smarty.server.PHP_SELF}" > 
-->

<!-- new code -->
<form method="post" action="{$smarty.server.PHP_SELF}" name="subregfrm">

 

<!-- then modify this line -->
<td width="175"><input type="password" name="password2" id="password2" size="25" onblur="checkpwmatch();"/></td>

<!-- right under that add this line -->

<td width="260" class="fieldarea"><span style="float: left;">Match: </span><div id="checkmatchresult"></div></td>  

 

that should be it for the register part, i will be back to post the view cart in a bit after breakfast. enjoy

Edited June 11, 2014 by durangod

[durangod]

Ok here is the view cart deal... orderforms/comparison/viewcart.tpl

 

add the js (function name and form name has changed because i like to use dif names)

 

{literal}
<script type="text/javascript">

function checkpwmatchcart()
{
var first = document.orderfrm.newpw.value;
var second = document.orderfrm.password2.value;

if(first === second)
{
 mesg = '<span style="color:#109710;">✔Passwords Match</span>';
 document.getElementById('checkmatchresult').innerHTML=mesg;  

 }else{
      mesg = '<span style="color:#8e1122;">✘ Passwords Do Not Match</span>';
      document.getElementById('checkmatchresult').innerHTML=mesg;      
      }

}//close function checkpwmatchcart
</script>
{/literal}

 

you will need to add the name to the form as before... it already has an id but i dont use that. Again the name has changed.

 

<form method="post" action="{$smarty.server.PHP_SELF}?a=checkout" id="orderfrm" name="orderfrm">

 

 

then AFTER this

<td>{$LANG.clientareaconfirmpassword}</td>

 

 

you add or modify this code.

<!-- changed this -->
<td><input type="password" name="password2" id="password2" size="20" value="{$password2}" onblur="checkpwmatchcart();"/></td>
</tr>
<!-- changed this -->
<tr><td> </td><td align="center" class="pwblk"><script language="javascript">showStrengthBar();</script></td></tr>

<!-- added -->
<tr><td> </td><td align="center"><span style="float: left;">Match: </span><div id="checkmatchresult"></div></td><tr>  
<!-- end add -->

 

and then in the style css file in the same dir you just add this..

 

.pwblk{
background-color: #000000;
border-bottom: 1px solid #000000;
text-align: left;
}

 

 

and thats it

 

it looks like this..

 

[WHMCS Ryan]

durangod, thanks for sharing this.

 

While we appreciate and encourage user-submitted shortcuts and workarounds, they are not tested or supported by WHMCS. We encourage everyone to review all aspects of workarounds before implementing them on a production server.