Solved

How do I select all table rows using a checkbox in the header using Jquery datatable tabletools?

Posted on 2014-04-23
3
13,498 Views
Last Modified: 2014-05-04
New to JQuery.
Thanks.
0
Comment
Question by:RSSY
3 Comments
 
LVL 32

Expert Comment

by:Big Monty
Comment Utility
One way would be to use the aoColumns property of datatables and just render your markup for the "sTitle" property as an html string.

http://www.datatables.net/usage/columns

//On datatable init the options would look something like this
"aoColumns": [{   "sTitle": "<input type='checkbox' id='selectAll'></input>"}]
Then you could just wire up a handler to the header checkbox after the datatable is created to check/uncheck all the checkboxes;

So something like:

$("#selectAll").toggle(function () {
       $("checkboxSelector", dataTable.fnGetNodes()).attr("checked", true); }
     , function () {
         $("checkboxSelector", dataTable.fnGetNodes()).attr("checked", false);
     }
 );
0
 
LVL 28

Accepted Solution

by:
sammySeltzer earned 500 total points
Comment Utility
Since you don't have any code to work with, then I will leave it up to you to integrate this code below into yours:

<script type="text/javascript">
$('#checkall').click( function() {
$('input', oTable.fnGetNodes()).each( function() {
$('input', oTable.fnGetNodes()).attr('checked','checked');
} );
return false; // prevent page refresh
} );
</script>

Open in new window


//markup
<form id="checkall"><input type="submit"/></form>

Open in new window

0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

743 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now