How to know if a checkbox is checked

Question

I'm trying to test if a checkbox is checked or no I found this solution but I'm getting nothing

if(document.getElementById('checkbox-1').checked) {
  alert("checked");
}

<input id="checkbox-1" class="checkbox-custom" name="checkbox-1" type="checkbox">

Possible duplicate of Check if checkbox is checked with jQuery — ProgrammerV5
– ProgrammerV5, Commented Apr 18, 2017 at 18:52
there isn't really any 'event' to trigger that JavaScript. Maybe that should happen when the checkbox is checked or not? on 'change' maybe? — sheriffderek
– sheriffderek, Commented Apr 18, 2017 at 18:52
The OP doesn't actually ask for event capturing, just how to test the checked state — JSDBroughton
– JSDBroughton, Commented Apr 18, 2017 at 18:59

Death-is-the-real-truth · Accepted Answer · 2017-04-18 19:03:21Z

1

You have to trigger click even of check-box which will call a function that do the desired task.

Example how you can do it:-

function checkClick(){
  if(document.getElementById('checkbox-1').checked) {
    alert("checked");
  }
}

<input id="checkbox-1" class="checkbox-custom" name="checkbox-1" type="checkbox" onclick="checkClick()"> <!-- trigger click event using onclick and calling a function -->

Note:- you can change function name according to your wish.

edited Apr 18, 2017 at 19:03

answered Apr 18, 2017 at 18:54

Death-is-the-real-truth

72.3k10 gold badges58 silver badges105 bronze badges

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

2 Comments

Heretic Monkey Over a year ago

In the modern era, we should not be encouraging the use of inline event handlers. Also, this question is a duplicate of many, many others.

Abhinav Galodha Over a year ago

It depends how the Inline event handlers are being used. For learning it's ok to use this code. Also, in this question OP said that it didn't work. That means the OP is asking about why the alert didn't work.

Abhinav Galodha · Accepted Answer · 2017-04-18 18:57:31Z

You need to Trigger the event. For checkbox, the onchange event would fire anytime the value changes. So, you need to hook up a event handler which can be a function reference or function declaration like onchange="checkboxChanged()

function checkboxChanged(){
if(document.getElementById('checkbox-1').checked) {
		  alert('checked');
		}
    else{
      alert('Not checked');
    }
}

<input id="checkbox-1" class="checkbox-custom" name="checkbox-1" type="checkbox" onchange="checkboxChanged()"/>

Collectives™ on Stack Overflow

How to know if a checkbox is checked

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related