Trigger checkbox event automatically by jQuery

Question

I want to trigger an event not manually but by jQuery itself.
Here understand my problem better:

$('.commonCheck').change(function () {
            if ($(".cashierCheck").attr("checked")) {
                $('.cashierInput').fadeIn();
                console.log("________________hr")
            }
            else{
                $('.cashierInput').fadeOut();
                console.log("_______________uncjecked")
            }
}

My checkbox:

<input type="checkbox" name="cashierFilter" id="cashierFilter" class="cashierCheck commonCheck" class="mrL0" />

When I manually check/uncheck the checkbox the change event is triggered without any problem. But I want the event to be happened when I somehow execute this:

$('#cashierFilter').prop('checked','true');

Tats_innit · Accepted Answer · 2013-10-17 08:06:50Z

2

Demo http://jsfiddle.net/ga9nn/

You can use trigger to fire events programatically:

$('#cashierFilter').prop('checked', true).trigger('change');

Also, you should use is to check the attributes of an element, and you can cache selectors in a variable to improve performance:

$('.commonCheck').change(function () {
    var $cashierCheck = $(".cashierCheck");
    if ($cashierCheck.is(":checked")) {
        $cashierCheck.fadeIn();
        console.log("________________hr")
    }
    else {
        $cashierCheck.fadeOut();
        console.log("_______________uncjecked")
    }
}

edited Oct 17, 2013 at 8:06

Tats_innit

34.1k10 gold badges74 silver badges77 bronze badges

answered Oct 17, 2013 at 8:03

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

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

2 Comments

Tats_innit Over a year ago

Bruvoo, added a demo, feel free to use it, sorry I touched your post yo! :) Woot up anyways. "demo* is with document .ready

Rory McCrossan Over a year ago

@Tats_innit nice one, my brother from another mother.

prakashapkota · Accepted Answer · 2013-10-17 08:04:18Z

2

Use "is" in jquery the best solution:

$('.commonCheck').change(function () {
    if ($(".cashierCheck").is(":checked")) {
                $('.cashierInput').fadeIn();
                console.log("________________hr")
            }
            else{
                $('.cashierInput').fadeOut();
                console.log("_______________uncjecked")
            }
});

http://jsfiddle.net/PpcLe/

answered Oct 17, 2013 at 8:04

prakashapkota

3212 silver badges6 bronze badges

Collectives™ on Stack Overflow

Trigger checkbox event automatically by jQuery

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related