Firefox caches hidden inputs

Question

I have a hidden input field in my form. I noticed that if that field's value is changed by javascript, and then the user refreshes the page, that same value will be set when the page reloads. From what I've seen, this only happens in Firefox.

I've solved this unwanted behaviour by adding autocomplete="off" to that hidden input, but W3C doesn't like this solution, and if i validate the page I get the error:

Attribute autocomplete not allowed on element input at this point.

Apparently, the autocomplete attribute works only on specific inputs - see here.

So is there any solution that will satisfy both W3C and Firefox?

The `autocomplete` tag is only valid in html5, so I'm adding the html5 tag to the question. — jmlnik, Mar 20 '12 at 13:42
see also http://stackoverflow.com/questions/2486474/preventing-firefox-from-remebering-the-input-value-on-refresh-with-meta-tag — user123444555621, Mar 20 '12 at 17:08
@Pumbaa80, tamir already tried using `autocomplete="off"` but that doesn't validate on `` according to the spec. Are you suggesting the cache tags/headers would prevent Firefox from auto-completing the form? — jmlnik, Mar 21 '12 at 03:54

jmlnik · Accepted Answer · 2012-03-21T03:50:07.727

13

To validate (which I wouldn't put as much effort into as you are) I think you could use autocomplete="off" on the entire form, then turn it back on selectively, like this:

<!DOCTYPE html>
<html>
<head>
    <title>TEST</title>
</head>
<body>
    <form autocomplete="off">
        <input type="hidden" name="test">
        <input type="text" name="otherfield" autocomplete="on">
    </form>
</body>
</html>

I initially thought this was a Firefox bug but after discussion with robertc in the comments, I think expected behavior depends on specific use cases. The spec doesn't allow autocompletion on hidden fields so my first reaction still feels right, but Firefox's implementation might have some good arguments to support it. Please comment.

edited Mar 21 '12 at 03:50

answered Mar 20 '12 at 13:34

jmlnik

2,867
2
17
20

1

Firefox caches the state of all form fields when you reload (and go forward and back), it's not bad, it's a feature. – robertc Mar 20 '12 at 17:38
2

@robertc, caching fields that can be edited by the user is good, yes, but caching hidden fields?!?! How is that useful or a feature? I believe the FF team simply didn't think about that use case and didn't implement the spec correctly. – jmlnik Mar 21 '12 at 00:26
1

@jonathan.dh If you're going to preserve the state of the form what is the point of just saving the visible fields? The user accidentally hits the back button (or backspace, or whatever), goes forward again and hits submit but then finds the form won't submit because some hidden value has not been cached. – robertc Mar 21 '12 at 03:17
@robertc, I see reasons for both and am on the verge of changing my mind. – jmlnik Mar 21 '12 at 03:44
@tamir, could you expand on your use case? – jmlnik Mar 21 '12 at 03:50
yes. in my case it's a login form which implements openid. a user can either enter his full openid url, or select a featured provider from a list and enter his username (pretty much identical to stackoverflow login page). there is a hidden field to determine which type of login the user choose - for example if the user wants to enter his username for wordpress, then "wordpress" is set in the hidden field. – tamir Mar 21 '12 at 22:43
FF behaviour can actually confuse the user. the default option is "openid full url", and therefore the default hidden field value is "openid". say the user choose "wordpress", the hidden field now has the value "wordpress". now the user hits refresh, and the new page loaded show that the selected option is "openid full url" even though the hidden field holds the cached value "wordpress". – tamir Mar 21 '12 at 22:48
1

So why not use this to your advantage and use javascript to set the selected option to what the hidden field says when the page loads? That way, if I select "Wordpress" and reload, it's still selected! :) – jmlnik Mar 21 '12 at 23:39
1

One thing I have noticed is that autocomplete="off" takes the other extreme and doesn't provide a drop-down of previously entered values when you double click the form. It would be good if there was a middle ground. – AntiElephant Dec 14 '17 at 20:37

score 4 · Answer 2 · answered Feb 12 '14 at 11:31

Alternatively, you could use <input type="text" style="display: none;" autocomplete="off" /> instead. It's a bit of a hack, but it should work!

The caching in Firefox is actually quite a good feature a lot of the time, but it does cause some problems when you build more dynamic forms.

Firefox caches hidden inputs

2 Answers2