Skip to content
Related Articles

Related Articles

How to get all checked values of checkbox in JavaScript ?

View Discussion
Improve Article
Save Article
  • Last Updated : 10 Feb, 2022

In this article, we will discuss how we can get all the checked values from the selected checkbox using HTML and javascript.

First of all, we will create some checkboxes and gave them some value, now for the javascript part we will create a function that will check if any of the checkboxes is selected if so, we will print it on the screen and it will work for all the checkboxes since we will use the loop throughout all the checkbox using its length property,

Example:

HTML




<!DOCTYPE html>
<html lang="en">
  
<body>
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
  
    <input type="checkbox" name="laptop" 
        value="HP">HP laptop<br>
      
    <input type="checkbox" name="laptop" 
        value="DELL">DELL laptop<br>
  
    <input type="checkbox" name="laptop" 
        value="MAC">MAC laptop<br>
  
    <input type="checkbox" name="laptop" 
        value="ASUS">ASUS laptop<br>
  
    <button onclick="getValue()"
        Get Value
    </button>
      
    <script>
        function getValue() {
            var checkboxes = 
                document.getElementsByName('laptop');
  
            var result = "";
  
            for (var i = 0; i < checkboxes.length; i++) {
                if (checkboxes[i].checked) {
                    result += checkboxes[i].value 
                        + " " + " Laptop, ";
                }
            }
            document.write("<p> You have selected : "
                    + result + "</p>");
        }
    </script>
</body>
  
</html>


Output: 


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!