Menu
I've noticed that browsers do not store form values until the form is submitted, which means that if you're using AJAX instead of a standard form submit, your browser's auto-fill is never populated. Is there a way to force populate your browsers auto-fill/auto-complete so that I can have this convenience with forms that are submitted via AJAX? It's annoying to go to my AJAX page and have to type in the same things in the form fields every time because the browser doesn't remember them.
My question is pretty much identical to the this one, except that only a work around in FireFox is provided as the accepted answer to that question. I'm looking for a solution that works in all major browsers (at least Chrome, FF, and IE), if there is one.
Note: I am not talking about AJAX auto-complete plugins, which is what almost always pops up when googling this question. I am talking about your browser's built-in auto-complete or auto-fill that helps you fill out forms by remembering what you entered in the past.
981
This is to stop the user from having the option to auto populate the fields. Place three instances of each form field on the form and hide the first and last fields of each set using css and then disable them after page load using javascript. This is to prevent the browser from filling in the fields automatically.
For anyone who's still trying to solve this, seem like I've found the answer.
Chromium tries to recognize the submit event, even if you preventDefault and handle the actual submission yourself.
That's it, you need to preventDefault the submit event, not the click event.
This worked on Chrome, Edge and IE 11 at the time of writing (I'm too lazy to download and test it on Firefox). Here's your form:
<form method="POST" id="my-form"> <label>Email</label> <input autocomplete="email" type="email" name="email"> <button type="submit">Subscribe</button> </form> Notice the autocomplete attribute. These are all the possible values that you can use for autocomplete.
In JavaScript, simply do this:
$("#my-form").on("submit", function (ev) { ev.preventDefault(); // Do AJAX stuff here }); The browser will remember whatever email you've entered on clicking subscribe button.
126
I have also come across this; there doesn't seem to be a great solution, certainly not a cross browser one, but here is one for IE I haven't seen anyone mention:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <SCRIPT> function subForm() { window.external.AutoCompleteSaveForm(f1); f1.submit(); } </script> </HEAD> <BODY> <FORM id=f1> User ID : <input type=text name=id></input><br> Password :<input type=password name=pw></input><br> E-mail :<input type = text VCARD_NAME = "vCard.Email"> <br> <input type=button value=submit onclick="subForm()"> </FORM> </BODY> </HTML> From: http://support.microsoft.com/kb/329156
21
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
