Bug With Firefox - Disabled Attribute of Input Not Resetting When Refreshing

Question

I've found what I believe to be a bug with Firefox and I'm wondering if this actually is a bug, as well as any workarounds for this.

If you create a basic webpage with the following source:

<html>
  <head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
  </head>
  <body>
    <div>
      <input id="txtTest" type="text" />
      <input type="button" onclick="$('#txtTest').attr('disabled','disabled');" value="Set Disabled (jQuery)" />
      <input type="button" onclick="document.getElementById('txtTest').disabled = true;" value="Set Disabled (js)" />
      <input type="button" onclick="$('#txtTest').removeAttr('disabled');" value="Remove Disabled" />
    </div>
  </body>
</html>

If you disable the textbox dynamically and then refresh the page, the textbox will remain disabled instead of resetting back to its original state of not disabled. I've tried this in IE8 and Chrome and those behave as I would expect, resetting the textbox back to not disabled when I refresh.

Another interesting bit of information is that it still does the same thing if the input is a checkbox instead of a textbox.

Are you sure it's not just the Firefox "feature" where it remembers the state of `input` elements when you simply refresh? — thirtydot, May 12 '11 at 23:51
@thirtydot: I was wondering about that too, so I also tried experimenting with dynamically setting the "size" attribute, and that does get reset upon refresh, just like all the other browsers. So it looks like what I've discovered so far is that Firefox will retain the disabled attribute as well as the actual value of the input, but not the size... — Stephen Mesa, May 12 '11 at 23:56
Wow, you're right! I set autocomplete="off" on the input and this no longer happens. That's pretty inconvenient that firefox turns that on by default! — Stephen Mesa, May 12 '11 at 23:58
Yeah, I'd forgotten you can disable it with `autocomplete="off"`. [This blog post](http://weblogs.asp.net/joelvarty/archive/2010/03/22/removing-the-autocomplete-or-f5-refresh-in-firefox-from-remembering-field-values.aspx) looks familiar to me, so I've definitely come across this before. You should write an answer to your own question (or should I?) — thirtydot, May 13 '11 at 00:06
There is an open Mozilla bug report about this: https://bugzilla.mozilla.org/show_bug.cgi?id=654072 — cvrebert, Sep 03 '14 at 23:57
[46845 - Form elements don't reset upon manually reloading page - bugzilla.mozilla.org](https://bugzilla.mozilla.org/show_bug.cgi?id=46845). This report was opened 22 years ago and closed 17 years ago. — li ki, Mar 28 '22 at 17:14

score 141 · Accepted Answer · edited Jul 11 '14 at 13:34

141

This is a "feature" of Firefox which remembers form input values across page refreshes. To fix this behavior, you simply set autocomplete="off" on the form containing the inputs, or just directly to the input.

This stops autocomplete from working and prevents the browser from remembering the state of input fields.

Alternatively, you can just "hard-refresh" by clicking CTRL+F5. This will completely reset the current page.

edited Jul 11 '14 at 13:34

Hello World

925
7
18

answered May 13 '11 at 15:49

Stephen Mesa

4,769
3
23
16

4

I just hit this problem when the user clicks the back button, seems like `autocomplete="off"` doesn't work in that case. – solarc Sep 02 '12 at 04:54
1

i don't want a form, I just have a single button and Firefox "remembers" it's disabled..annoying. I can reset it via JS but..ugly. – vsync May 07 '13 at 21:43
@vsync Try setting it on the button/input element. Should work, too! – Henrik Heimbuerger Jul 09 '13 at 12:08
6

You even have to do this on buttons. I find it hard to believe that this is a feature and not a bug? – Liam Mar 26 '14 at 10:07
1

this also affects hidden inputs also – Liam Mar 26 '14 at 10:46
This was driving me nuts. I am using a jQuery button. Command - Refresh and the button was enabled, but a regular refresh and it was not. Made no sense, thanks @stephen-mesa. – Bumptious Q Bangwhistle Dec 02 '15 at 09:11
Setting it on the **form** is a little over-the-top, but sadly **MDN** says it _ignores the attribute_ on basically all but _type=text_ - the [english page](https://developer.mozilla.org/en/docs/Web/HTML/Element/Input#attr-autocomplete) linked me here, yet the [german page](https://developer.mozilla.org/de/docs/Web/HTML/Element/Input#attr-autocomplete) mentions the ignore issue (the autocomplete paragraph is currently still in english!) QUOTE: This attribute is ignored if the value of the type attribute is hidden, checkbox, radio, file, or a button type (button, submit, reset, image). – flowtron Dec 20 '15 at 10:08
1

First time encountering this issue and your solution worked out of box. But i set it only on the button rather than the whole form, as autocomplete is a great feature for fields too. Thanks – Julius Aug 03 '18 at 22:38

score 10 · Answer 2 · answered Dec 27 '13 at 11:11

10

To deal with the back button, do this (from here)

    window.addEventListener('pageshow', PageShowHandler, false);
    window.addEventListener('unload', UnloadHandler, false);

    function PageShowHandler() {
        window.addEventListener('unload', UnloadHandler, false);
    }

    function UnloadHandler() {
        //enable button here
        window.removeEventListener('unload', UnloadHandler, false);
    }

answered Dec 27 '13 at 11:11

Joshua Fox

18,704
23
87
147

I don't know why this answer has only one up vote while the other answer has 99. Restoring the disabled state on unload is better than disabling autocomplete, since autocomplete is a desirable functionality. – Nick Feb 13 '17 at 04:04
I think that `//enable button here` is redundant here; my comprehension of referred docs is that simply the *presence* of event listener will prevent the page to be stored in the BFcache. – myf Jun 12 '18 at 09:50
Note that adding an unload handler has other side effects in Firefox: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/1.5/Using_Firefox_1.5_caching#section_5 – robocat Dec 07 '18 at 01:12

score 3 · Answer 3 · answered Mar 20 '20 at 12:51

This is indeed an open bug in Firefox. There is also a note in MDN: autocomplete (scroll down to the second yellow box):

Note: The autocomplete attribute also controls whether Firefox will — unlike other browsers — persist the dynamic disabled state and (if applicable) dynamic checkedness of an <input> element, <textarea> element, or entire <form> across page loads. The persistence feature is enabled by default. Setting the value of the autocomplete attribute to off disables this feature. This works even when the autocomplete attribute would normally not apply by virtue of its type. See bug 654072.

If you are using Bootstrap, you might be interested in the

phk · Answer 4 · 2017-08-30T17:28:42.163

As mentioned before you need to add autocomplete="off" to your buttons.

Here is a sh+perl snippet to automate this in the case of <button>s in your HTML files/templates (under some assumptions):

find /path/to/html/templates -type f -name '*.html' -exec perl -pi -e \
  's/(?<=<button )(.*?)(?=>)/@{[(index($1,"autocomplete=")!=-1?"$1":"$1 autocomplete=\"off\"")]}/g' \
  {} +

The assumptions are:

Opening <button> tags begin and end on the same line. If this is not the case (i.e. they might be split over several lines) then replacing /g with /gs should help (the s modifier causes . to match newlines as well)
Valid HTML (e.g. there are no funny characters between < and >) and no unescaped greater than (>) inside the opening tag.

Bug With Firefox - Disabled Attribute of Input Not Resetting When Refreshing

4 Answers4

Linked

Related