Disable Google Toolbar Autofill

Question

The Google Toolbar's autofill feature has been the bane of my web development existance for the past several years. I have always settled on trying to create a timer control to check for changes since the developers epically failed to fire change events on controls. This has gotten further and further complicated when controls are buried inside nested repeaters, and then trying to tie it to an UpdatePanel is a further complication.

Has anyone succesfully been able to prevent Google Toolbar from filling in form fields without renaming the field to something insignifcant? (note: This doesn't work for a 'State' dropdown, it even goes as far as to check field values).

For as smart as Google employees are supposed to be, this was a grandly moronic oversight.

Update: For those who may be coming here looking for a solution. What I have found to work so far is you have ASP.net, is to use the server control "Timer" and to set this control as a trigger for the UpdatePanel. It helps to loop through and check for changed values.

If you only have access to javascript, or are using another framework, then I found using the following function to work the best (I was trying to monitor state and zip changes. The focusElement is required because when hovering in a dropdownlist, it changes the selectedindex):

    function MonitorChanges(sStateDropdownID, sZipCodeID, sHiddenStateFieldId, sHiddenZipFieldId, bDoPostback) {
        var state = $('#' + sStateDropdownID).val();
        var zip = $('#' + sZipCodeID).val();
        var hiddenstate = $('#' + sHiddenStateFieldId).val();
        var hiddenzip = $('#' + sHiddenZipFieldId).val();
        $('#' + sHiddenStateFieldId).val(state);
        $('#' + sHiddenZipFieldId).val(zip);

        var compareString = state + zip;
        var compareHiddenString = hiddenstate + hiddenzip;

        var focusElement = getElementWithFocus();
        if (compareString != compareHiddenString && isShippingZip(zip)) {
            bDoPostback = true
        }

        if (parseInt(focusElement.id.search('drpState')) == -1 && parseInt(focusElement.id.search('txtZip')) == -1 && bDoPostback) { bDoPostback = false; __doPostBack(sStateDropdownID, ''); }

        var f = function() { MonitorChanges(sStateDropdownID, sZipCodeID, sHiddenStateFieldId, sHiddenZipFieldId, bDoPostback); }
        setTimeout(f, 1000);
    }

Answer 1

Just out of curiosity, does autofill still fire when you set the AutoCompleteType to disabled?

<asp:TextBox ID="textBox1" runat="server" AutoCompleteType="Disabled" />

Answer 2

I'm not entirely sure if this will work or not, but I recall coming across it as a possible solution.

Try breaking apart the labels of keywords with span tags.

<label for="firstName">Fi<span>rs</span>t N<span>am</span>e:</label>
<input id="firstName" name="firstName">

Also, supposedly Google is planning to support autocomplete="false" in Firefox. No clean IE solution, yet, though.

Answer 3

I once have a problem with autofill in firefox. I did this to prevent it.

 <div style="display:none">
    <input type="text" name="user" />
    <input type="password" name="password" />
 </div>

 <input type="text" name="user" />
 <input type="password" name="password" />

Don't know if it also work with google autofill.

Answer 4

According to a recent post by a Google developer, using the autocomplete="off" attribute will disable Google toolbar auto-completion in both IE and Firefox. Note that this attribute must be applied to the <form> tag and not the individual <input> tags:

<form method="post" action="http://example.com" autocomplete="off">
<!-- ... -->
</form>

While this is not an instant fix, it is probably the most reliable solution possible - if it is possible to wait until the next iteration of the Google toolbar.