disableautofill.js icon indicating copy to clipboard operation
disableautofill.js copied to clipboard

Doesn't work if the input is outside the form

Open matronator opened this issue 5 years ago • 5 comments

I originally had a regular text input outside of the form tags with the form attribute linking it to the form. I tested it (in Safari) but the input was still getting auto completed as I typed. I moved the input inside the form and removed the form attribute and it started working as expected.

Don't know if this is a bug or just an inconvenience (so feature request?), but it would be nice to have with working with the input outside of form as well.

Otherwise great plugin! Really helpful for what I'm working on right now.

matronator avatar Apr 06 '19 15:04 matronator

It's not much use outside the form, no?

barrychapman avatar Apr 07 '19 04:04 barrychapman

How so? If you specify the form attribute, you can still submit the form as you would normally do.

matronator avatar Apr 07 '19 13:04 matronator

Oh nevermind I see. I missed that part.

It should be fairly straightforward to select all the inputs with that form attribute

barrychapman avatar Apr 07 '19 23:04 barrychapman

The caveat is, that you would need to do a full DOM scan for any elements that were directed to that form. When applying it to the form, you are looking at all the children, while if you take into consideration the elements occurring outside the form... Well, you would basically need to do this:

 jQuery(document.body).on('click', 'input[type="submit"]', function(e) {
      // first check to see if the click input has a form attribute
      var formId = jQuery(this).attr('form');
      if (formId.length) {
           e.preventDefault();   // prevent form from submitting prior to performing operations
           // then you will want to grab that attribute, and target the form in question:
           jQuery('#' + formId).disableAutoFill() // or whatever. You may even need a custom function inside the library itself to forcibly perform the replacements against the form instead of listening for a click.
           this.submit();  // submit form once all processes are complete? maybe as a callback even to the `disableAutoFill()`
      }
});

Something like that may be the best bet.

TL;DR - you will basically need to listen on all nodes that have the form="whatever" attribute in order to intercept appropriately. There are messy ways and messier ways to do this, and some not-so-messy.

barrychapman avatar Apr 08 '19 00:04 barrychapman

Can we apply this on particular text filed not for all the password fill. I dont have form tag but want to apply this on password fill.

Please suggest on this.

shaangidwani avatar Jul 08 '19 14:07 shaangidwani