CODEWITHSUNDEEP
jqueryautofill
A_funs
A_funs

Reputation: 1246

Jquery .keyup .keydown .keypress don't detect browser autofill

I am using these events to try to evaluate form input, but if the form is autofilled by the browser these events don't fire. How can I make the event fire on autofill as well?

Upvotes: 8

Views: 3416

Answers (3)

myh34d
myh34d

Reputation: 311

I know it's quite old question, but I solved the same problem using e.preventDefault() after the keyup function.

$("#email").keyup(function (e)  {
        e.preventDefault();

In this way if you select with enter the suggestion by the browser autofill it will notice. The problem still remains when you click with the mouse on the suggestion, but it works fine if you press any key after selected it.

FINAL SOLUTION

I found this post on stackoverflow: https://stackoverflow.com/a/24746108/3481005

and using .on("input") does the trick!

$("#email").on("input",function (e)  {

Upvotes: 5

Frank Koehl
Frank Koehl

Reputation: 3186

You can fake the desired behavior a bit by binding to the .click() and/or .dblclick() events.

It's not guaranteed, but you might snag an extra mouse click if they decide to "approve" the autocomplete by selecting it from the box.

Upvotes: 0

Explosion Pills
Explosion Pills

Reputation: 191789

There is no way to detect a browser autofill, unfortunately. Instead, use setInterval, for example, to run a function at a fairly high frequency that checks whether the original value (or empty) matches the input value and trigger the response that way. If you don't want to do that, you're probably SOL since the browser will not even trigger .change, and any event is most likely not cross-browser compliant.

You could also have the validation events run on form submission as well, which should be just as effective.

Upvotes: 2

Related Questions