11
votes

I'm writing an application in PHP that uses forms to retrieve the username and password input. After a successful login, web browsers will prompt to save the username and password (tested with Firefox, Safari, and Chrome).

However, if the user login fails, the browser will still prompt to save the password (which is obviously not the intended behavior). How can I indicate the the browser that the login was not successful and that details should not be prompted to be saved?

Here is the HTML for the login page:

<html>
  <head><title>Login</title></head>
<body>
  <style text="css">
    fieldset {
      padding: 10px;
      width: 250px;
      text-align: right;
    }
</style>
<form method="POST" action="checkLogin.php">
  <fieldset>
  <label for="user">Username: <input type="text" id="user" name="username" size="15" /></label><br />
  <label for="pass">Password: <input type="password" id="pass" name="password" size="15" /></label><br />
  <p><input type="submit" value="Login" /></p>
</fieldset>    
</form>
</body>
</html>

The checkLogin.php script simply checks the login info with the DB to ensure it is valid, and prints "Failed login attempt" if the credentials were incorrect.

Can someone shed some light on this subject? I know this is a minor issue, but I don't notice my browser offering to save passwords for failed logins on other websites.

Thanks in advance!

2

2 Answers

6
votes

I am pretty sure the problem is that "checklogin.php" is not the same page on which this form appears. You should post the form to itself, and redraw the login form if it fails.

If you don't redraw the form, or you post to another page, most likely the browser will assume the login succeeded. I would guess that most browsers determine failure by the fact that the same form is still there. It should only disappear when successful.

3
votes

This is probably not the simplest way to do this, but what I have done is use AJAX to submit the form and place the page that I want to send the user to in action attribute of the form. The submit button would then be of type button instead of type submit and would call the Javascript function that performs the AJAX request when it is clicked. If the asynchronous request to the checklogin.php file returns that the login was successful I use JavaScript to submit the form which really just sends the user to the next page, but the browser will ask to save the password. Another benefit to this method is that the page will not have to reload when an incorrect password is submitted.