Solved

I would like to add a display characters option to password entries

Posted on 2008-09-30
3
194 Views
Last Modified: 2010-04-16
Some windows password input boxes have a checkbox that allows you to see the characters you are entering into a password input.
It seems a pretty easy answer with javascript checkbox deciding whether to input in password style or text style.. but I am pretty weak at javascript
0
Comment
Question by:levelninesports
  • 2
3 Comments
 
LVL 4

Expert Comment

by:TurboBorland
ID: 22611509
You would have to use something that can change a value in the form.  Something like DOM manipulation in Javascript.
Simply change the type= from "password" to "text" when the checkbox is checked.
<html>
<script language="javascript">
function show() {
document.formname.pass.type = 'text';
}
</script>
<body>
<form name="formname" method="POST" action="">
Username:  <input type="text" value="" name="user" /><br />
Password:  <input type="password" value="" name="pass" /><br />
<input type="checkbox" name="change" onClick="show()" />Show Password<br />
<input type="submit" value="Submit" />
</form>
</body>
</html>
0
 

Author Comment

by:levelninesports
ID: 22621122
That's pretty good.. now what do I have to do to have the input type switch back to password when they unclick?
0
 
LVL 4

Accepted Solution

by:
TurboBorland earned 500 total points
ID: 22621681
Add an if/else statement:
<html>
<script language="javascript">
function show() {
  if (document.formname.change.checked == true) {
    document.formname.pass.type = 'text';
  } else {
    document.formname.pass.type= 'password';
  }
}
</script>
<body>
<form name="formname" method="POST" action="">
Username:  <input type="text" value="" name="user" /><br />
Password:  <input type="password" value="" name="pass" /><br />
<input type="checkbox" name="change" onClick="show()" />Show Password<br />
<input type="submit" value="Submit" />
</form>
</body>
</html>
0

Featured Post

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
change home folder path 4 52
Error viewing ASP page 12 162
Need script to search multiple files in one drive 13 44
Looking for a program that deletes all files of same size 18 59
Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
Foolproof security solutions has become one of the key necessities of every e-commerce or Internet banking website. If you too own an online shopping site then its vital for you to equip your web portal with customer security features that can allow…
This video teaches users how to migrate an existing Wordpress website to a new domain.
The viewer will learn how to dynamically set the form action using jQuery.

786 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