How to dynamically check/uncheck html checkbox by JavaScript

Question

I know that several questions about this topic have been asked, but I was unable to find an answer for my case.

I have a checked checkbox as

<input type="checkbox" name="text" checked="checked" />

I need to send ajax request by checking/unchecking, but I do not know what can be the reliable (with browser compatibility) for an if statement such as

if (this.value == 'on')
{
this.value = 'off';
ajax call;
}
else
{
this.value ='on';
ajax call;
}

Note that the value is not important here, and we need to catch checked/unchecked, but how control the checked element by JavaScript when the html original element has checked="checked"?

If using checked instead of value as

if (this.checked == true)
{
this.checked = false;
ajax call;
}
else
{
this.checked =true;
ajax call;
}

The tick of checkbox will not be changed in the browser (always ticked).

Hanlet Escaño · Accepted Answer · 2013-10-29 19:02:50Z

4

The following should work:

function myFunction(elem)
{
    if (elem.checked)
    {
        alert("Im Checked");
    }
    else
    {
        alert("Im not checked");
    }
}

Markup:

<input type="checkbox" name="text" checked="checked" onchange="myFunction(this);" />

http://jsfiddle.net/QMhn5/

Update: To change the check from other element:

document.getElementById("chk").checked = true;

or

document.getElementById("chk").checked = false;

Example: http://jsfiddle.net/QMhn5/1/

edited Oct 29, 2013 at 19:02

answered Oct 29, 2013 at 18:42

Hanlet Escaño

17.4k10 gold badges54 silver badges76 bronze badges

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

1 Comment

Googlebot Over a year ago

How to check/uncheck?

pax162 · Accepted Answer · 2013-10-29 18:42:48Z

1

If you can use jquery, this should work:

<input type="checkbox" id="c1" />


$("#c1").change(function(){
    var checked = $(this).is(":checked");
    console.log(checked);
    //ajax call
})

Fiddle: http://jsfiddle.net/XUgTC/ , try clicking the checkbox and look in the console.

answered Oct 29, 2013 at 18:42

pax162

4,7452 gold badges25 silver badges30 bronze badges

3 Comments

Hanlet Escaño Over a year ago

I don't think the OP wants jQuery.

Hanlet Escaño Over a year ago

:) no need to apologize, I do that all the time.

Googlebot Over a year ago

@HanletEscaño yes I am attached to pure JS.

Collectives™ on Stack Overflow

How to dynamically check/uncheck html checkbox by JavaScript

2 Answers 2

1 Comment

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related