Query classnames of checked items as array? [duplicate]

Question

I have many checkboxes on a page, like this:

<input type="checkbox"  id="cb_31" class="observedType1">
<input type="checkbox"  id="cb_32" class="observedType1" checked="checked">
<input type="checkbox"  id="cb_33" class="observedType1">
<input type="checkbox"  id="cb_40" class="observedType2" checked="checked">

I then wanted to retrieve the classes of all checked boxes in an array (ideally as a list of unique items), so I'm looking to for ['observedType1'l'observedType2'].
My best idea was: var clss=$("[class*='observedType']:checked").attr("class"); but that only gives me a string "observedType1".

How can I get the array I am looking for? (or a "list" to walk through in a loop)...

There's also a fiddle

you almost got it you just need to iterate on all the checked checkbox — guradio
– guradio, Commented May 4, 2017 at 11:08

Satpal · Accepted Answer · 2017-05-04 12:07:42Z

3

You need to iterate all the :checked checkboxes, here you can use .map()

var clss=$("[class*='observedType']:checked").map(function(){
   return $(this).attr('class')
}).get();

Updated Fiddle

I would recommend you to use custom data-* prefix custom attribute to store the arbitrary data.

<input type="checkbox" id="cb_31" class="observedType" data-type="observedType1">

Which can be retrieved using .data() method

var clss = $(".observedType:checked").map(function() {
  return $(this).data('type')
}).get();

With Custom attribute Fiddle

edited May 4, 2017 at 12:07

answered May 4, 2017 at 11:04

Satpal

134k13 gold badges168 silver badges171 bronze badges

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

2 Comments

MBaas Over a year ago

Cool stuff - thanks! Especially for data-* !

MBaas Over a year ago

Updated your fiddle so that actually works with the custom-attribute AND added unique...

boehm_s · Accepted Answer · 2017-05-04 11:06:20Z

1

you can do the following in javascript :

var myInputs = document.getElementsByTagName('input');
var myCheckedInputs = Array.from(myInputs).filter(function(input) {
  return input.checked;
});

answered May 4, 2017 at 11:06

boehm_s

5,5644 gold badges36 silver badges46 bronze badges

Collectives™ on Stack Overflow

Query classnames of checked items as array? [duplicate]

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related