Ticking Checkbox When Clicking on Row

When dealing with tables, majority of them will have a checkbox in the first column. In order to make it a little bit more user friendly, it is always nice to be able to tick the checkbox no matter where you click on that row – and we can do that very easily with some JavaScript! It is as simple as that.

The JavaScript

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

It is as simple as that! The second line basically triggers a click when a TR (row) element under the table class “dataTable” is clicked.