coder coder - 3 months ago 9
jQuery Question

Check multiple checkbox selection using jquery

I am trying to find the easiest way to get the checkboxes that are selected.

Here's my script:

$(document).ready(function() {
$("input[name='chkTextEffects']").change(function() {
if ($("#cbSolid").is(':checked') == true) {
alert('Solid');
} else if ($("#cbOutline").is(':checked') == true) {
alert('Outline');
} else if ($("#cbSolid", "#cbOutline").is(':checked') == true) {
alert('SolidOutline');
} else if ($("#cbSolid", "#cbOutline").is(':checked') == false) {
alert('No Effects');
}
});
});‚Äč


HTML:

<input type="checkbox" name="chkTextEffects" id="cbSolid" value="Solid" />Solid
<input type="checkbox" name="chkTextEffects" id="cbOutline" value="Outline" />Outline
<input id="TextEffectsSelection" type="hidden" />


I'm not sure about this line
if ($("#cbSolid", "#cbOutline").is(':checked') == true)
or should I use
bind
to get that worked.

Answer

Here is an example I created that demonstrates what I think you're attempting to achieve:

$('#getCheckboxesButton').live('click', function(event) {
    var checkboxValues = [];
    $('input[type="checkbox"]:checked').each(function(index, elem) {
        checkboxValues.push($(elem).val());
    });
    alert(checkboxValues.join(', '));
});

http://jsfiddle.net/qdvng/

Let me know if that helps. Its basically using the ':checked' jQuery selector to retrieve checkboxes that are checked, then iterating through their values and printing it out.