Question

10

How to check multiple checkboxes with JavaScript?

rated 0 times [ 11] [ 1] / answers: 1 / hits: 91613 / 10 Years ago, sat, april 19, 2014, 12:00:00

I have multiple checkboxes

<div class=data>    

    <span>

    <input name=employee type=checkbox value=Alex/>

    <label for=employee>Alex</label>

    </span> 



    <span>

    <input name=employee type=checkbox value=Frank/>

    <label for=employee>Frank</label>

    </span>    



    <span>

    <input name=employee type=checkbox value=Mark/>

    <label for=employee>Mark</label>

    </span>

</div>

How to find all checked checkboxes and create json or array with result of checking?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

mckinley

Add To Favorites

Follow

Total Points: 15

Total Questions: 101

Total Answers: 94

Location: Liechtenstein

Member since Fri, Sep 11, 2020

4 Years ago

answered 10 Years ago mustafaericho · Accepted Answer

In case you just want to use pure/vanilla JS, here is an example:

HTML HEAD

<script type=text/javascript>

function getCheckedCheckboxesFor(checkboxName) {

    var checkboxes = document.querySelectorAll('input[name=' + checkboxName + ']:checked'), values = [];

    Array.prototype.forEach.call(checkboxes, function(el) {

        values.push(el.value);

    });

    return values;

}

</script>

HTML BODY

<div class=data>    

    <span>

    <input name=employee type=checkbox value=Alex/>

    <label for=employee>Alex</label>

    </span> 



    <span>

    <input name=employee type=checkbox value=Frank/>

    <label for=employee>Frank</label>

    </span>    



    <span>

    <input name=employee type=checkbox value=Mark/>

    <label for=employee>Mark</label>

    </span>



    <input type=button onclick=alert(getCheckedCheckboxesFor('employee')); value=Get Values />

</div>

JS Fiddle link: http://jsfiddle.net/dY372/