Multiple checkboxes with same name. How do I know which ones are unchecked?

Question

So I just encountered a weird situation that checkbox is just stressing me out. I am trying to build a "milestone" function which looks like this:

[Browsing state][1] | [Edit state][2] [1]: https://i.stack.imgur.com/f0XV4.png [2]: https://i.stack.imgur.com/SLFQU.png

I use ms[] here so I can pull all the items in back end using PHP POST.

<input type="text" class="form-control" name="ms[]" value="<?=$value["content"]?>">

The problem is that when I get these checkboxes using $_POST['ms[]'], it actually just gives me an array of only the checked items. Then I can't really know which ones are unchecked by user.

I read through some popular solutions here and all of them seems to require the name attributes of my inputs to be different. But since the "milestone" is deletable and addable, I can't give it a unique name for each one.

I also came up with some other possible solutions like making all these checkboxes hidden textboxes. And every time user check or uncheck a checkbox, the corresponding textbox is set to '1' or '0'. But this requires me to revamp the whole thing.

I am just wondering if there is any easy and reliable way to get a complete list of the checkboxes no matter they are checked or not?

Thank you for your help in advance.

score 0 · Answer 1 · answered Nov 23 '16 at 01:14

try this, there are various way you can do that. Either on each state change of checkbox or get once on some event.

For each checkbox click.

$(document).ready(function(){
    $('input[type=checkbox]').each(function(){
        //register for each checbox a click event
        $(this).on('click', function(){
           //check if this checbox is checked or not
           if($(this).is(':checked') == false)
           {
            //your logic
          }
        });
    });
});

Or before submitting to server,

 $(document).ready(function(){
        $('input[type=checkbox]').each(function(){
            //check if this checbox is checked or not
            if($(this).is(':checked') == false)
            {
              //your logic
            }
        });
    });

I am not sure how these would help me get the full list of checkbox status in backend. Can you explain what you would put in `//your logic` section? What I can imagine is to set the value of the corresponding checkbox to "1" or "0" in that section, but that doesn't help at all because in the back end it still gets only "checked" boxes. — Patrick Mao, Nov 23 '16 at 01:45
By using (2) approach you will get all unchecked checboxes before sending to server. Accumulate those one by one and send to your server. — ScanQR, Nov 23 '16 at 04:09

Multiple checkboxes with same name. How do I know which ones are unchecked?

1 Answers1