Posted By

jlvallelonga on 03/24/09


Tagged

password text background color validate change field confirmation


Versions (?)

confirm password background change


 / Published in: JavaScript
 

URL: http://justpushbuttons.com/examples/password_example.php

I just put all the functions in here the validateConfPass function uses the key event and the two text fields to change the background color of the confPassword field when it does not equal the pass field

  1. <html>
  2. <head>
  3. <title>password confirm</title>
  4. <script type="text/javascript">
  5. function validateConfPass(e, confPassword, pass) {
  6. keychar = getCharacterPressed(e);
  7. if (keychar != "-1") {
  8. if (keychar == "backspace") {
  9. lenOfConf = confPassword.value.length - 1;
  10. if (confPassword.value.substr(0, lenOfConf) != pass.value.substr(0, lenOfConf))
  11. confPassword.style.background = "#FFBBBB";
  12. else
  13. confPassword.style.background = "#FFFFFF";
  14. }
  15. else {
  16. lenOfConf = confPassword.value.length + 1;
  17. if (confPassword.value + keychar != pass.value.substr(0, lenOfConf))
  18. confPassword.style.background = "#FFBBBB";
  19. else
  20. confPassword.style.background = "#FFFFFF";
  21. }
  22. }
  23. }
  24.  
  25. function getCharacterPressed(e) {
  26. code = getKeyCode(e);
  27. keychar = "-1";
  28. if (pressedPrintableChar(code))
  29. keychar = String.fromCharCode(code);
  30. if (code == 8)
  31. keychar = "backspace";
  32. return keychar;
  33. }
  34.  
  35. function getKeyCode(e) {
  36. code = -1;
  37. if (window.event)
  38. code = e.keyCode;
  39. else if (e.which)
  40. code = e.which;
  41. return code;
  42. }
  43.  
  44. function pressedPrintableChar(code) {
  45. if (code != 8 && code != 13 && code + "" != "undefined")
  46. return true;
  47. return false;
  48. }
  49. </script>
  50. </head>
  51. <body onload="javascript: document.frm.password.focus();">
  52. this code highlights the confirm password field when it is different from the password field<br />
  53. <form name="frm">
  54. password: <input type="password" name="password" id="password*" /><br />
  55. confirm password: <input type="password" id="confPass" onkeypress="javascript: validateConfPass(event, this, document.getElementById('password*'));" /><br />
  56. <input type="submit" value="Submit" />
  57. </form>
  58. </body>
  59. </html>

Report this snippet  

You need to login to post a comment.