AJAX not submiting checkbox values to PHP page - php

Question

I previously had the form set up with just radio input so the value was only one or the other. The client now wants it to be a check box so you could search by multiple variables at once.
I setup a test jQuery method to making sure it was at least making the correct string to be submitted with the follow:
function showValues() {
var datastr = $(".formC").find("input[type='checkbox']").serialize();
$( "#bodyA" ).text( datastr );
}
$(".localSearch").on('click', showValues);
Here is the result:
expertise%5B%5D=Ancillary&expertise%5B%5D=LargeGroup&expertise%5B%5D=IndividualPlans
I am very new to AJAX, jQuery, and PHP but this seems like the correct string to be submitting.
Now I am using jQuery AJAX to submit the values over to my PHP page.
$('.localSearch').on('click', function() { //Pulls data based on radial input
var dataStr = $(".formC").find("input[type='checkbox']").serialize();
$.ajax({
type: "POST",
datatype: "html",
data: {
expertise: dataStr
},
url: "expertise.php",
success: function (data) {
$("#bodyA").html(data);
}
});
});
Here is what the form looks like: (The form contains more but these are the only elements for expertise.php)
<label for="agent">Agent Services:</label><br />
<label for="ancillary"><input type="checkbox" value="Ancillary" name="expertise[]" id="ancillary" />Ancillary</label><br />
<label for="smallgroup"><input type="checkbox" value="SmallGroup" name="expertise[]" id="smallgroup" />Small Group</label><br />
<label for="largegroup"><input type="checkbox" value="LargeGroup" name="expertise[]" id="largegroup" />Large Group</label><br />
<label for="medicare"><input type="checkbox" value="Medicare" name="expertise[]" id="medicare" />Medicare</label><br />
<label for="longterm"><input type="checkbox" value="LongTermCare" name="expertise[]" id="longterm" />Long Term Care</label><br />
<label for="individual"><input type="checkbox" value="IndividualPlans" name="expertise[]" id="individual" />Individual Plan</label><br />
<label for="tpa"><input type="checkbox" value="TPASelfInsured" name="expertise[]" id="tpa" />TPA Self Insured</label><br />
<label for="ppaca"><input type="checkbox" value="CertifiedForPPACA" name="expertise[]" id="ppaca" />Certified for PPACA</label><br />
<label for="acaind"><input type="checkbox" value="ACA_Ind" name="expertise[]" id="acaind" />Individual Marketplace Certified</label><br />
<label for="acashop"><input type="checkbox" value="ACA_Shop" name="expertise[]" id="acashop" />Shop Marketplace Certified <br />(small group)</label><br />
<span class="localSearch">Submit</span>
I had it working when it was only dealing with one value but the string it creates seems to be the correct string. Any ideas on this? If you need anymore code or anything then just let me know!
Live site if needed

Answer 1

You're serializing everything in the checkbox element set. I suspect you just need the value of a given attribute (id or value). And only items that are checked. Here's an example of dumping selected checkboxes into an array:
$(".formC input:checkbox:checked").each(function(){ myArray.push($(this).val()); })
jQuery get values of checked checkboxes into array
Once you have an array, you can loop through it to put together your sql WHERE predicates.