AJAX Form submit with save password from browser and no "Confirm form submission" request if I reload the page

Question

I'm doing a simple login form on my site. Here is the situation:

If I do a pure Jquery AJAX form submission and then redirect (in the JS code), the browser doesn't offer to save the info (ie username and password).
If I do a normal form submit, when I land on the next page and I do back or refresh, I get that very irritating and annoying "Confirm form submission".

My question is, it possible to get the best of both worlds? If yes, how?

To be clear, I want to do a form submit, preferably using AJAX so that if there is an error, I don't have to reload the page and just display the error, I want the browser to offer the possibility of saving the information and I don't want the "confirm form submission" on the page I redirect.

I thought of adding a page in the middle, so submit to a blank page that just redirects to the page I want to go. But once you are there, if you hit back, you are redirected to the same page, so you have click back 2 times. Is that how other people do it?

Thanks for your help.

PS: I've seen all these posts...

PPS: Seems like the submit to iframe no longer works in modern browsers.

Use [history.forward()](http://www.w3schools.com/jsref/met_his_forward.asp) on login page. — Kundan Singh Chouhan, Sep 15 '12 at 11:08
Maybe, use AJAX for form validation and displaying errors, and the old-fashion POST refresh form for login logic ? — Radoslav Georgiev, Sep 15 '12 at 11:10
@RadoslavGeorgiev - Thanks, but that won't solve the "confirm form submission" issue. — denislexic, Sep 15 '12 at 11:39

score 0 · Answer 1 · answered Apr 23 '13 at 17:59

For this to work, you need a well-formed HTML form element, with method and action, and a submit button as well, like this one:

<form method="post" action="login.xxx" onsubmit="return validate();">
  <input type="text" id="username" />
  <input type="password" id="password" />

  <input type="submit" value="Send" />
</form>

After that, handle everything into the validate javascript method, preventing your form post (that will work on a non-javascript environment anyway) and using ajax instead:

function validate() {
  // Ajax request using gathered form data, followed by a redirect to the logged-in page

  return false; // To prevent form submission
}

This way, your login info should be saved. For the "Confirm form submission" message, it will not appear since you'll do an javascript redirect if login info is okay.

AJAX Form submit with save password from browser and no "Confirm form submission" request if I reload the page

1 Answers1