HTML

Script

function setBoxToPasswordmode(box) {
if (box.value == box.defaultValue) {
box.type = “password”;
box.value = “”;
}
}

function resetBox(box) {
if (box.value == “”) {
box.type = “text”;
box.value = box.defaultValue;
}
}

As you know, the user login box of the website contains the following fields username and password. Furthermore, most of them put the “Username” inside user name field and “********” inside password field to save the space within designing.In this …

Thanks!

Just a quick note. This does not work on IE. Any reason / idea why ?

function changeToPassword(){
document.login.password.type = “password”;
document.login.password.value = “”
}

I call this on both the onSelect and onClick events so that when the user tabs to the field, the script does its thing too.

Also, you can do this all without the surrounding divs. I’ve made a working demo and posted it here: http://pastie.org/219689

In this example, I made something similar for an email field.

After digging around online for other solutions, I saw one where someone did something like: document.getElementById(‘inputId’).type = “password” or “text”

that seemed to work well, but was a bit too sketchy for my taste, as I was worried about the potential for submitting old passwords.

cheers,
Phillip

@Spacebat
Even ajax doesn’t work when javaScript is turned off.Furthermore, in your code you can use the posted value of actual password field to do so..and you can login man…if you can’t login do tell me..I’ll can make you login through this kinda system..

Ideally the source of the form would look as it does normally and javascript would insert a text input next to the password one in the DOM, toggle the visibility and add the event handlers for the purposes you describe here.

You’ve made a good start though…

Truth be told, I’ve always kinda disliked it when people put “username” and “password” in the input fields instead of labeling the fields separately… I feel like it doesn’t adequately cue the user when the context is placed *inside* the text field.

But I’m glad to see how to do it if I ever find the need!