serializing checkboxes in jQuery

Question

I have a jQuery form in which I create a series of checkboxes:

<?php
<form method="post" id="b-form" action="../createb.php">
 for ($i=0; $i<$request_count; $i++){
 <div class="request-check">
 <table>
 <tr>
 <td><input type="checkbox" name="show_request[]" value="request".$i." checked="checked"/>select request</td>
 </tr>
 </table>
 </div>
 }

javascript

$.ajax({
 type: 'POST',
 url: '../createb.php',
 data: $('#b-form').serialize(),
 success: function (msg){
 alert(msg);
 }
})

at the moment createb.php is just testing the form

 $requests = $_POST['show_request'];
 $request_count = count($requests);
 echo 'count: '.$request_count;
 echo $requests[0];

The Problem is that the serialize function only sees the first checkbox and indicates whether it has been checked or not. It does not see any of the other check boxes. Does anybody have an idea why the other check boxes do not get serialized and what to do about it?

Thanks David

• Vincent Mimoun-Prat: Can you also paste here the HTML code generated by your script? The code you have pasted here looks strange to me?!

Answer 1

Quote from Jquery documentation: Only "successful controls" are serialized to the string (when using $(form).serialize()) or to array($(form).serializeArray()). Values from checkboxes and radio buttons (inputs of type "radio" or "checkbox") are included only if they are checked.

You can use something like this to emulate behavior similar to what you expect:

var myCbValuesArray = $("input:checkbox").map(function(){
 return $(this).is(":checked");
}).get();

Answer 2

Your selector is wrong.

Try :

$('#b-form input:checkbox').serialize()

For get only checked input, use :

$('#b-form input:checkbox:checked').serialize()

Answer 3

Well, that's true as you are having all checkboxes with the name name and any id to separate them.

try to create them like:

<input 
 type = "checkbox" 
 id = "ckb_<?php echo $i ?>"
 name = "ckb_<?php echo $i ?>_show_request[]" 
 value = "request".$i."
 checked = "checked"/> select request

I'm sure that $('#b-form').serialize() will now generate all checkboxes as you want them

Answer 4

This will work for you.

You can get selected checkboxes values by

 $("input[type='checkbox']:checked").serialize();