How to make checkboxes have the same submit behavior as other inputs?

Posted by Tim Santeford on Stack Overflow See other posts from Stack Overflow or by Tim Santeford
Published on 2010-06-10T19:04:57Z Indexed on 2010/06/10 19:12 UTC
Read the original article Hit count: 175

Filed under:
|
|

I have a search form where several checkboxes are checked by default. When the form submits, as a GET, the url will only contain the list of checkboxes that were left checked.

http://www.example.com/page/?checkbox1=yes&checkbox2=yes

It is difficult with this scenario to determine the difference between when a user first arrives at this search page and when they submit the form with all checkboxes unchecked because the querystrings look the same.

To combat this problem I have started injecting a hidden field before the checkbox with the same name and a 'no' value. When the checkbox is unchecked the browser will send the hidden field's no value and when the checkbox is set then the browser is overriding the hidden field with the checkbox's 'yes' value.

<input type="hidden" name="checkbox1" value="no" />
<input type="checkbox" name="checkbox1" value="yes" />

when the user submits the form with all checkboxes unchecked I get this querystring:

http://www.example.com/page/?checkbox1=no&checkbox2=no

This seems to work on ff, chrome, ie5.5+ so I'am I safe in using this method or is there a better way to make checkboxes submit like inputs and selects?

© Stack Overflow or respective owner

Related posts about html

Related posts about form