table row click event and checkboxes

Question

I have a click event attached to a table row and within columns i have checkboxes.

<table>
    <tbody>
        <tr class='shop_order_single_table'>
            <td><input type='checkbox' /></td>
            <td><input type='checkbox' /></td>
            <td><input type='checkbox' /></td>
        </tr>
    </tbody>
</table>

When i click the checkbox the click event for the row still executes.

Here is my code:

     $(".shop_order_single_table").on("click",function() {
   //click event executes
                });

How do i have the click event for the table row not execute when clicking a checkbox?

http://stackoverflow.com/questions/9183381/how-to-have-click-event-only-fire-on-parent-div-not-children — Jordumus, Apr 01 '15 at 12:33
Please see ["Should questions include “tags” in their titles?"](http://meta.stackexchange.com/questions/19190/should-questions-include-tags-in-their-titles), where the consensus is "no, they should not"! — , Apr 01 '15 at 13:28

Timur Osadchiy · Accepted Answer · 2015-04-01T12:42:05.637

1

$(".shop_order_single_table input").on("click", function(e) { 
   e.stopPropagation();
});   

$(".shop_order_single_table").on("click", function(e) { 
   // Your code
});

edited Apr 01 '15 at 12:42

answered Apr 01 '15 at 12:34

Timur Osadchiy

5,699
2
26
28

I tried this and the click event is still executed? – user892134 Apr 01 '15 at 12:38
Thanks, updated code works! – user892134 Apr 01 '15 at 12:44
@user892134 always welcome! – Timur Osadchiy Apr 01 '15 at 12:47

table row click event and checkboxes

1 Answers1