CODEWITHSUNDEEP
javascriptjquerydatatables
erikvimz
erikvimz

Reputation: 5476

jQuery check all checkboxes in datatable

I have the following javascript code inside index.php:

$(function () {
     $('.checkall').click(function () {
          $(this).find(':checkbox').attr('checked', this.checked);
     });
});

I retrieve information via ajax and create a table from that information using jQuery Data Tables, inside data tables head I have a checkbox with class='checkall'.

Why doesn't the checkbox that is inside the head check all other checkboxes retrieved via ajax?

*I get not errors inside Firebug

*I checked How to check every checkboxes in a jquery datatable? but still don't get it ... :(

Upvotes: 0

Views: 6238

Answers (3)

aquinas
aquinas

Reputation: 23796

In addition to what GreyBeardedGeek said, if you are loading via ajax, if your checkall checkbox is being created via an ajax call and is inserted into the DOM, then your click event will NOT fire. In this case, you should use "on" (or "live" depending on your version of jQuery): http://api.jquery.com/live/. Example:

$(document).on("click", ".checkall", 
  function(){ $(this).find(':checkbox').attr('checked', this.checked); });

Upvotes: 0

Ghokun
Ghokun

Reputation: 3465

$(function () {
     $('.checkall').click(function () {
          $(':checkbox').not(this).attr('checked', this.checked);
     });
});

works if there is no other checkbox on the page besides your head checkbox and the ones you want to check

Upvotes: 1

GreyBeardedGeek
GreyBeardedGeek

Reputation: 30088

I think that your problem is probably with your use of $(this), which probably references the 'checkall' checkbox.

find() finds descendents of the node, and the checkboxes that you want to check are not descendants of that checkbox.

The example that you cite shows the correct way to do it, by referenceing datatable.fnGetNodes()

Upvotes: 1

Related Questions