Checkbox Stays Checked on Page Refresh

Question

This a pretty simple question (I assume). Probably a repost, but I couldn't find the answer here... so here we go.

I have a checkbox on a page that I want to default to "unchecked" (unless I specify otherwise in my php).

When I refresh the page, if the box was checked, it will stay checked which is no-bueno because checking the box adds a dom element to my page via a function attached to the box. So the problem is if I refresh, the box is still checked, but the dom element doesn't exist (because I haven't fired the function and I don't want to unless the user checks the check box) but the box is ALREADY checked and I end up in opposite land where UN checking the box creates my dom element and checking it removes it.

Basically, the question is...

Is there a way to default a checkbox to unchecked without javascript?

BTW I haven't checked (no pun intended) in any browsers other than FF 3.5.10

Answer 1

See http://weblogs.mozillazine.org/gerv/archives/2006/10/firefox_reload_behaviour.html (first comment):

It’s done that way on purpose so if you tap the refresh button you don’t lose your work. There’s an entry in Bugzilla somewhere that’s been WONTFIXed asking for a regular refresh to always reset the form entirely. Basically it’s a backwards-compatibility thing — every browser since NS1.0 (maybe even Mosiac) has done that.

Dynamically-generated pages don’t even reset themselves, though if the expiration is set to 0 and you hit the back button it will give you a fresh form. Also, if the form itself changes (add or remove elements, change the action, etc.) the for will reset on a reload. I haven’t tested it, but setting the form name to something random (assuming you don’t need the name for JS access) might just work. Like ”> in PHP.

As you said, forcing a refresh clears the form, and resetting it does too. Would something like do what you want (again, not tested)?

Answer 2

In fact, you just have to add the <form> tag with attribute autocomplete="off":

<form autocomplete="off">
     <label for="checkbox">
          <input type="checkbox" id="checkbox">
     </label>
</form>