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

html firefox input textbox
Stephen Mesa picture Stephen Mesa · May 13, 2011 · Viewed 38.1k times · Source

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.

Answer

Stephen Mesa picture Stephen Mesa · May 13, 2011

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.

Related questions

onchange event on input type=range is not triggering in firefox while dragging

When I played with <input type="range">, Firefox triggers an onchange event only if we drop the slider to a new position where Chrome and others triggers onchange events while the slider is dragged. How can I make …

Read More
How to disable Chrome spell check on INPUT with HTML or jQuery code?

I have an input in an HTML page <input id="SearchBox" type="text" value="" width="300px" title="Search the card pool" autocomplete="off" maxlength="170"> I would like to switch this off with something like autospellcheck="off". Is there …

Read More
Hide scroll bar, but while still being able to scroll

I want to be able to scroll through the whole page, but without the scrollbar being shown. In Google Chrome it's: ::-webkit-scrollbar { display: none; } But Mozilla Firefox and Internet Explorer don't seem to work like that. I also tried this …

Read More