Referecing the boolean value of a checkbox from a function

Posted on 2006-04-30
Last Modified: 2009-07-29
I am a javascript newbie. I am using Google Maps on my site, and add the following control:

<input type="checkbox" id="chkA" onClick="getOverlays()">

From my getOverlays function, I want to be able to use the IF statement (or case) to decide the incoming value from the checkbox, ie, if it is checked or not. That way I can run either of two scenarios.

How can I pass the checked value of the checkbox through to the function?

Question by:Craig_Muckleston
    LVL 11

    Expert Comment

    Hi Craig,

    To assign the boolean value of the checkbox to the variable 'bool,' place the following line within your function getOverlays() :

    var bool = document.getElementById('chkA').checked;

    Peace and joy.  mvan
    LVL 63

    Accepted Solution

    Or you extend your function call to this:
    <input type="checkbox" id="chkA" onClick="getOverlays(this)">

    Then your checkbox value acces can be done like this:


    function getOverlays(theBox){
        // do this
      } else {
       // do that


    LVL 15

    Expert Comment

    Also, if you wanted to keep your function from having to deal with a checkbox object and just receive a boolean, you can pass directly from your input element:


    function getOverlays(someBool)
        // Do whatever you want with the value stored in someBool


    <input type="checkbox" id="chkA" onClick="getOverlays(this.checked)">

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Maximize Your Threat Intelligence Reporting

    Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

    This article shows how to create and access 2-dimensional arrays in JavaScript.  It includes a tutorial in case you are just trying to "get your head wrapped around" the concept and we'll also look at some useful tips for more advanced programmers. …
    In Part 1 ( we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    794 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    16 Experts available now in Live!

    Get 1:1 Help Now