Geek asks and answers

JQuery: disable 'click' event on checkbox

In my current jQuery, I have an event that will either check or clear the checkbox if the user clicks on a row in the table. The problem is that if the user does validate the checkbox, jquery fires the checkbox event and checks / unchecks the checkbox, but then the TR event occurs and then uncheck the checkbox value.

See an example here: http://jsfiddle.net/radi8/KYvCB/1/

I can turn off this check box, but if the user tries to check the box, the TR event will not fire.

I need a method to disable the 'click' event, but still allow the TR event to fire when the checkbox is selected.

var charges = {
    init: function() {
        // get the selected row checkbox
        //$('.charges').attr('disabled', true);
        $('.rowclick tr').click(function() {
            if ($(this).find('td input.charges:checkbox').is(':checked')) {
                $(this).find('td input.charges:checkbox').attr("checked", false);
            }
            else {
                $(this).find('td input.charges:checkbox').attr("checked", true);
            }
        });
    }
};
charges.init();
+3
source share
2 answers

, click checkbox - . , e.stopPropagation.

    $('.rowclick tr').click(function(e) {
        if($(e.target).closest('input[type="checkbox"]').length > 0){
            //Chechbox clicked
        }else{
            //Clicked somewhere else (-> your code)
            if ($(this).find('td input.charges:checkbox').is(':checked')) {
                $(this).find('td input.charges:checkbox').attr("checked", false);
            }
            else {
                $(this).find('td input.charges:checkbox').attr("checked", true);
            }
        }
    });

: http://jsfiddle.net/KYvCB/5/

+14

click:

var charges = {
    init: function() {
        $('.td input.charges:checkbox').on('click', function (e)
        {
            e.stopPropagation();
        })
        $('.rowclick tr').click(function() {
            if ($(this).find('td input.charges:checkbox').is(':checked')) {
                $(this).find('td input.charges:checkbox').attr("checked", false);
            }
            else {
                $(this).find('td input.charges:checkbox').attr("checked", true);
            }
        });
    }
};
charges.init();

http://jsfiddle.net/KYvCB/4/

+2

More articles:


All Articles