Mr. Alien Mr. Alien - 6 months ago 54
jQuery Question

Click table rows to select checkbox using jQuery

As I didn't find any question asked before, on how to toggle checkbox on click of a table row, so I would like to share my approach to this...


Inorder to select checkbox of a row inside the table, we will first check whether the type attribute of the element we are targetting is not a checkbox, if it's not a checbox than we will check all the checkboxes nested inside that table row.

$(document).ready(function() {
  $('.record_table tr').click(function(event) {
    if ( !== 'checkbox') {
      $(':checkbox', this).trigger('click');


If you want to highlight the table row on checkbox checked than we can use an if condition with is(":checked"), if yes than we find the closest tr element using .closest() and than we add class to it using addClass()

$("input[type='checkbox']").change(function (e) {
    if ($(this).is(":checked")) { //If the checkbox is checked
        //Add class on checkbox checked
    } else {
        //Remove class on checkbox uncheck