Show saved password in login form

Question

I have a website with a login form that pops ups (a "modal-window" div).

When the login form is opened the inputs shows the browser's saved username and password.

When a user changes the username/pass and enters an invalid one (validation is done with Ajax) and then he closes the window (using $('#whatever').hide() ), when he clicks the login button again the input shows the same wrong user/pass he entered before.

Is there any way to force the browser to set the stored login information into a form?

Answer 1

Well it shows the previous information because you're not updating that area correct? Nor could you for that matter. Those fields are set by the browser on initial load, not on an async call.

If the user enters in proper username/password, the browser will then prompt them to save that data, and then on subsequent visits, those values will be stored.

You can't explicitly tell the browser to save a username and or password.

You also can't write the password to a textbox with its textmode set to password as it is read only.

Answer 2

If the username and password are set as values of the inputs when the page is loaded, then you can simply reset the form. Resetting the form will revert the inputs to their values at page load. For instance, when I load the page, say my form looks like this:

<form id="login-form">
    <input type="text" name="username" value="matt" />
    <input type="text" name="password" value="pw" />
</form>

If I change the username and password to something invalid, you can just call $('#login-form').get(0).reset() , and the fields will revert to their default values.

Check this out: http://jsfiddle.net/sQV7T/