I have checkboxes like so:

<ul id="searchFilter">
    <li><input type="checkbox" name="price[]" class="cb_price" value="1"> $200,000 to $299,999</li>
    <li><input type="checkbox" name="price[]" class="cb_price" value="3"> $300,000 to $399,999</li>
    <li><input type="checkbox" name="price[]" class="cb_price" value="5"> $400,000 to $499,999</li>
    <li><input type="checkbox" name="price[]" class="cb_price" value="8"> $500,000+</li>
</ul>

How would I alert the price[] to see what is checked? I am very new at jquery :(

I have checkboxes like so:

<ul id="searchFilter">
    <li><input type="checkbox" name="price[]" class="cb_price" value="1"> $200,000 to $299,999</li>
    <li><input type="checkbox" name="price[]" class="cb_price" value="3"> $300,000 to $399,999</li>
    <li><input type="checkbox" name="price[]" class="cb_price" value="5"> $400,000 to $499,999</li>
    <li><input type="checkbox" name="price[]" class="cb_price" value="8"> $500,000+</li>
</ul>

How would I alert the price[] to see what is checked? I am very new at jquery :(

• javascript
• jquery

• When do you want to alert..? Do you want to alert the name price[] or the actual price which is displayed? – T J Commented Jul 15, 2014 at 19:10
• if i select values 1 and 5, I am looking for an alert with 1,5 – user3723240 Commented Jul 15, 2014 at 19:11
• So one alert after checking one , and another with both values after clicking both..? – T J Commented Jul 15, 2014 at 19:12
• 1 $('input[name="price[]"]').filter(":checked").map(function () { return this.value; }).get()); - jsfiddle/H7mCt – Ian Commented Jul 15, 2014 at 19:12
• 2 @Ian please post answers as answer so the question won't remain unanswerd forever... – T J Commented Jul 15, 2014 at 19:14

6 Answers 6

First, you can get the checkboxes by name:

var checkboxes = $('input[name="price[]"]');

Then, to get the values of the checked ones, you can filter by the pseudo selector :checked, and then collect their values:

checkboxes.filter(":checked").map(function () {
    return this.value;
}).get()

DEMO: http://jsfiddle/Fn9WV/

References:

• jQuery().filter() - http://api.jquery./filter/
• jQuery().map() - http://api.jquery./map/

You can try this:-

var selected = [];
$('[name="price[]"]:checked').each(function(checkbox) {
selected.push(checkbox);
});

Use the selector $('#searchFilter [name="price[]"]:checked') with jquery to find all the checked checkboxes with the name "price[]" in this form. This will be zero or more elements, depending on how many are checked.

Then use the jquery each() function to iterate over the found checkbox elements, and collect their values into the "checked" array. In the callback function to each(), the this points to the current element's dom node, wrap it with $(this) to create a jquery object and use .val() to retrieve the value from it.

Finally merge the items into a string, to form a ma separated list using the join() function of the "checked" array. It can be an empty string if none of the checkboxes are checked.

var checked = [];

$('#searchFilter [name="price[]"]:checked').each (function (i, e)
{
    checked.push ($(this).val ());
});

alert (checked.join (','));

Notice that other answers used this.value to retrieve the "value" attribute of the checkbox instead of using $(this).val(), which is the jquery way to do it and less error prone.

Try the following:

var alert="";
$('input[type=checkbox]').each(function () {
  if($(this).attr("checked") == 1)) alert += $(this).val();
  if(alert.length > 1) alert(alert);
});

One way would be to set each checkbox to a specific id. Then you could use $('#' + id).is(":checked") to see if the checkbox is checked. If the checkbox is checked, you could get the range and store it in a variable. You can then return that variable.

Check this page if you need some help with the checkbox.

//get val on click    
$(document).on('click', ".cb_price", function () {
            if ($(this).is(':checked')) {
                 alert($(this).val());
            }
        });

//a button to call the function
$(document).on('click', ".some_button", function () {
            function getitems();
        });

function getitems(){
$(".cb_price").each(function () {
                //
                var $chk = $(this);
                if ($chk.is(':checked')) {
                    checkboxes = checkboxes + $(this).val() + ","
                }    
            });
alert(checkboxes);
}