Trigger onclick event with Javascript

Question

I am trying to trigger an onclick event via Chrome Developer Tools that will check all checkboxes on the page and also trigger the onclick event of all checkboxes on the page.

Here is a sample checkbox on the page:

<input type="checkbox" onclick="ctl00_ContentAreaHolder1_uctlLocationSelectionControl_AccountStructureTreeView.HandleCheck(this,'p_686660',4);" name="checker_p_686660">

Here is my code to check all checkboxes on the page:

(function() {
    var aa= document.getElementsByTagName("input");
    for (var i =0; i < aa.length; i++){
        if (aa[i].type == 'checkbox')
            aa[i].checked = true;
    }
})()

The only thing I cannot figure out is how to trigger the onclick event when the checkbox is checked. Any help is appreciated!

Did you figure it out?

Madnx
– Madnx

2014-02-09 16:46:55 +00:00
Commented Feb 9, 2014 at 16:46 — Madnx
– Madnx, Commented Feb 9, 2014 at 16:46

Madnx · Accepted Answer · 2014-02-09 16:52:20Z

1

You may want to do that:

$('input[type="checkbox"]').each(function(){
    $(this).trigger('click');
    // Will check all the checkbox and trigger the event
});

or simply:

$('input[type="checkbox"]').each(function(){
    $(this).click();
    // Will check all the checkbox and trigger the event
});

or you can do it, using your code:

(function() {
    var aa= document.getElementsByTagName("input");
    for (var i =0; i < aa.length; i++){
        if (aa[i].type == 'checkbox')
            aa[i].click()
    }
})()

edited Feb 9, 2014 at 16:52

answered Feb 9, 2014 at 16:27

Madnx

1,5644 gold badges16 silver badges23 bronze badges

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

1 Comment

three3 Over a year ago

the code that begins with var aa= document.getElementsByTagName works for me. However, I am in need of more help! After all of the checkboxes are checked after running this code, another set of checkboxes appear that also need to be checked with the first set of checkboxes REMAINING checked. So I added the condition if (aa[i].type == 'checkbox' && !aa[i].checked) to the code. However, when I run this, the page seems to freeze and it does not check the new set of checkboxes. Is there something I am doing wrong? Thanks for the help!

Milind Anantwar · Accepted Answer · 2014-02-09 16:28:30Z

0

For checking all the checkboxes:

 $("input[type=checkbox]").each(function () {
            $(this).prop("checked", true);
        });

For triggering to check all:

 $("input[type=checkbox]").each(function () {
            $(this).trigger('click');
        });

answered Feb 9, 2014 at 16:28

Milind Anantwar

82.3k26 gold badges97 silver badges128 bronze badges

Comments

Rakesh Kumar · Accepted Answer · 2014-02-09 16:30:18Z

0

Try this solution

<input type="checkbox" name="checker_p_686660">

Jquery Code

$('input').on('change', function(){

    if( $(this).prop('checked', true) ){
        alert('checked');
    }

})

Working Example: http://jsfiddle.net/2p64P/1/

answered Feb 9, 2014 at 16:30

Rakesh Kumar

2,8631 gold badge22 silver badges37 bronze badges

Collectives™ on Stack Overflow

Trigger onclick event with Javascript

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related