getting the checkboxes values checked-JavaScript

Question

I have check boxes inside a form (id='submit_slides_1'):

After submitting the form I want to fetch all of the values of the checked checkboxes:

<input type='checkbox' class='chk_selection_info_box' name='thumb_selection[]' value='" + images[i]['url'] + "'>

and in my javascript I have the following code:

$("#submit_slides_1").submit(function(e) {
    e.preventDefault();
    var x=$("#thumb_selection").is(":checked");
    alert(x);
  }
);

But it keeps giving me False; Am I missing something?

ADDED: Tried but it says "undefined" too:

$(".chk_selection_info_box:checked").each(function(i,l)
{
    alert(l.value);
});

If you need more clarification, please let me know which part you need more clarification!

Thanks

You say the form has the name of 'submit_slides_1', but you're selecting the form with the id of "#submit_slides_1". This is obvious, but not necessarily correct; please: show your HTML, don't describe it at us. — David Thomas
– David Thomas, Commented Nov 11, 2013 at 21:07
@David: No thei d is 'submit_slides_1'; my bad! still not working! — user385729
– user385729, Commented Nov 11, 2013 at 21:11
I think what you need is $('[name="thumb_selection[]"]:checked').map(function(){return this.value}); will return the array of values of the checked check boxes — PSL
– PSL, Commented Nov 11, 2013 at 21:13
.is() returns a boolean representing whether the condition is true or false. Move the :checked pseudo class to your selector $('#thumb_selection:checked') — War10ck
– War10ck, Commented Nov 11, 2013 at 21:14

epascarello · Accepted Answer · 2013-11-11 21:12:22Z

3

There is no element with that id. That would be what you are missing. Add the id.

BUT your code suggests you have multiple checkboxes, if that is the case, setting an id will not work and using a class would not work since is() will only work off the first element.

var checkedElements = $(".chk_selection_info_box:checked");

You than would need to use .serialize(), .map(), or .each() to get all the values.

edited Nov 11, 2013 at 21:12

answered Nov 11, 2013 at 21:07

epascarello

208k20 gold badges206 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Jade Over a year ago

Using an ID won't work if she wants the checked status from multiple checkboxes.

user385729 Over a year ago

thats true: multiple checkboxes: even the following code does not work: $(".chk_selection_info_box:checked").each(function() { alert($this.val()); }); says this undefined? Why?

epascarello Over a year ago

Because there is no $this, there is $(this)

Blue Skies · Accepted Answer · 2013-11-11 21:11:07Z

1

If they all have the .chk_selection_info_box class, then select those elements with the :checked selector, and .map() the values to a collection, and convert it .toArray().

var values = $(".chk_selection_info_box:checked").map(function(i, el) {
    return el.value
}).toArray();

answered Nov 11, 2013 at 21:11

Blue Skies

2,99520 silver badges19 bronze badges

5 Comments

user385729 Over a year ago

You solved my problem; but why my code does not work! I didnt have any cluew about maps!

Blue Skies Over a year ago

@Pasargad: The is() method returns a boolean value that tells you if the element matches the selector. The .map() simply takes the collection, and creates a new collection with the return values of the callback function. So we selected all the boxes that are checked, and returned the .value of each box to the new Array.

user385729 Over a year ago

It meakes sense ti me now; could you please let me know a solution with each loop as well! I guess this one should work too, but apparently not: $("#thumb_selection:checked").each(function() { alert($this.val()); });

user385729 Over a year ago

I am sorry to let you know your solution just return the very last chechbox selected!

Blue Skies Over a year ago

@Pasargad: No it doesn't. It will return all the values for all the checked checkboxes with that class. Do all your boxes have that class? The code in your comment above will only return one result because you can only have one ID on the page. The answer you accepted uses the same selector I'm using, but I've shown how to get the values.

heymega · Accepted Answer · 2013-11-11 21:11:06Z

-2

Try this mate

var x = $(".chk_selection_info_box").prop('checked');

answered Nov 11, 2013 at 21:11

heymega

9,4518 gold badges45 silver badges63 bronze badges

Collectives™ on Stack Overflow

getting the checkboxes values checked-JavaScript

3 Answers 3

3 Comments

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related