How to make checkboxes have the same submit behavior as other inputs?
- by Tim Santeford
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?
