How to submit 0 if checkbox is unchecked and submit 1 if checkbox is checked in HTML

Question

How to submit value 1 if a checkbox in a checkbox array is checked, and submit 0 if it's unchecked? I tried this but no luck. I am trying to grab this array in a php array when the form is submitted. Please help!

<input id = 'testName0' type = 'checkbox' name = 'check[0]' value = '1' checked> <input id='testNameHidden0'  type='hidden' value='0' name='check[0]'>  <input id = 'testName1' type = 'checkbox' name='check[1]' value = '1' unchekced> <input id='testNameHidden1'  type='hidden' value='0' name='check[1]'>  <input type = 'submit' value = 'Save Changes'> > <script> if(document.getElementById('testName0').checked){   document.getElementById('testNameHidden0').disabled = true; } </script>  <script> if(document.getElementById('testName1').checked){   document.getElementById('testNameHidden1').disabled = true; } </script> 

Answer 1

Simplest one, no javascript required, just put a hidden input before the checkbox:

<input type="hidden" name="check[0]" value="0" /> <input type="checkbox" name="check[0]" value="1" /> 

Inputs need to have the same name. If the checkbox is checked then value 1 will be submitted, otherwise value 0 from the hidden input.

Your case javascript solution, no hidden inputs needed:

<script type="text/javascript">     // when page is ready     $(document).ready(function() {          // on form submit         $("#form").on('submit', function() {             // to each unchecked checkbox             $(this + 'input[type=checkbox]:not(:checked)').each(function () {                 // set value 0 and check it                 $(this).attr('checked', true).val(0);             });         })     }) </script>  <form method="post" id="form">     <input type="checkbox" name="check[0]" value="1" />     <input type="checkbox" name="check[1]" value="1" />     <input type="submit" value="Save Changes" /> </form> 

PHP solution, no hidden inputs needed:

<?php     // if data is posted, set value to 1, else to 0     $check_0 = isset($_POST['check'][0]) ? 1 : 0;     $check_1 = isset($_POST['check'][1]) ? 1 : 0; ?>  <form method="post">     <input type="checkbox" name="check[0]" value="1" />     <input type="checkbox" name="check[1]" value="1" />     <input type="submit" value="Save Changes" /> </form> 

EDIT: the javascript solution is not valid anymore as of jquery 1.6. Based on this, a more proper solution is the following:

<script type="text/javascript">     // when page is ready     $(document).ready(function() {          // on form submit         $("#form").on('submit', function() {             // to each unchecked checkbox             $(this).find('input[type=checkbox]:not(:checked)').prop('checked', true).val(0);         })     }) </script>  <form method="post" id="form">     <input type="checkbox" name="check[0]" value="1" />     <input type="checkbox" name="check[1]" value="1" />     <input type="submit" value="Save Changes" /> </form>