JavaScript: Insert selected CheckBox values in an Array

Adnaan

SOLVED CLOSED ACTIVE ANSWERED
User: Adnaan
Posted: on Feb 22, 2025 06:59 AM
Forum: JavaScript
Answer: 1
Views: 224

How to get the selected checked CheckBoxes in an Array using JavaScript?

I have multiple CheckBoxes in the page.

<input type="checkbox" id="chkMango" value="Mango" /><label for="chkMango">Mango</label>
<input type="checkbox" id="chkApple" value="Apple" /><label for="chkApple">Apple</label>
<input type="checkbox" id="chkOrange" value="Orange" /><label for="chkOrange">Orange</label>
<input type="button" value="Show" />

When i check some or all Checkboxes i want its value to be save into an Array.

Download FREE API for Word, Excel and PDF in ASP.Net

mohammad...

0 1

Reply
ANSWER
User: mohammadumarsk684
Replied: on Feb 22, 2025 08:58 PM
Report

Hi Adnaan,

Use push function to insert item to Array in JavaScript.

Refer below sample.

HTML

<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        body { font-family: Arial; font-size: 10pt; }
    </style>
</head>
<body>
    <input type="checkbox" id="chkMango" value="Mango" /><label for="chkMango">Mango</label>
    <input type="checkbox" id="chkApple" value="Apple" /><label for="chkApple">Apple</label>
    <input type="checkbox" id="chkOrange" value="Orange" /><label for="chkOrange">Orange</label>
    <input type="button" value="Show" onclick="Show()" />

    <script type="text/javascript">
        function Show() {
            var selectedItem = [];
            var checkboxes = document.querySelectorAll('input[type=checkbox]:checked');

            //Saves values of Each checked CheckBoxes.
            for (var i = 0; i < checkboxes.length; i++) {
                selectedItem.push(checkboxes[i].value);
            }

            alert("Selected Items: " + selectedItem.join(", "));
        }
    </script>
</body>
</html>

Demo

Screenshot

Downloads

Download Sample

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

JavaScript: Insert selected CheckBox values in an Array

Company

Explore

Follow us

Contact Us