How to submit 0 if checkbox is unchecked and submit 1 if checkbox is checked in HTML
71,315
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>
Author by
Rishabh Gusain
Updated on December 28, 2021Comments
-
Rishabh Gusain over 2 years
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>
-
Rishabh Gusain almost 9 yearsbut whats the prob with this javascript?
-
JungleZombie almost 9 yearsThere is really no need to use javascript for such simple task. But i have edited my answer to include javascript and php solution too.
-
Jon P over 4 yearsYou have introduced jQuery here, where it is not mentioned at all in the question.
-
Basj about 4 yearsImportant note: the HTTP request will contain both values if the checkbox is checked. (Or did I misunderstand something?)
-
A Friend over 3 years@JonP The selected answer with 57 upvotes also uses Jquery as the primary solution. I don't think it's far to downvote an answer because it uses a library. It's an answer, regardless of how the result was obtained.
-
Jon P over 3 years@AFriend, don't assume I down voted. I simply left a comment, over a year ago.
-
A Friend over 3 years@JonP I was only directing the first sentence of my comment at you, bud.
-
Admin about 3 yearsthis helped me understand how the getAttribute method works as a whole ty
-
Noman Shaikh over 2 yearsIn my case I need javascript because I use array of named fields so thanks for update
-
MateuszC about 2 yearsMan, this no js anwser is spot on. Good job!