How to select the all the rows in jquery data table - asp.net-mvc

Question

I have two buttons in my page "Select All" and "Deselect All". I need to select the all the rows when i click the select all button and save the list of id in my variable. When Click deselect ll button it should be deselect the all rows . How will we do that?
[HttpPost]
public ActionResult Action Name(pssing value)
{
DataTable dataTable = new DataTable();
// my code
var MyModel = new List<List<string>>();
foreach (var joblist in Jobs)
{
var sublist = new List<string>();
sublist.Add(checked.false);
sublist.Add(values));
sublist.Add(values));
....etc
baseModel.Add(sublist);
}
return new DataTableResult(return);
}
Html :
<table cellpadding="0" cellspacing="0" border="0" class="display" id="AssignJobsTable" width="100%">
<thead>
<tr>
<th><input type="checkbox" id="selectall"/></th>
<th>ID</th>
etc ......
</tr>
</thead>
script:
$(function(){
// add multiple select / deselect functionality
$("#selectall").click(function () {
$('.case').attr('checked', this.checked);
});
// if all checkbox are selected, check the selectall checkbox
// and viceversa
$(".case").click(function(){
if($(".case").length == $(".case:checked").length) {
$("#selectall").attr("checked", "checked");
} else {
$("#selectall").removeAttr("checked");
}
});
});
When i click the select all check box it cant bind the value form the controller.

Answer 1

try this
$('table#tableId> tbody > tr').addClass('highlight');
$('table#tableId> tbody > tr').removeClass('highlight')addClass('noHeilight');

Answer 2

sample table
<table border="1">
<tr>
<th><input type="checkbox" id="selectall"/></th>
<th>Cell phone</th>
<th>Rating</th>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="1"/></td>
<td>BlackBerry Bold 9650</td>
<td>2/5</td>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="2"/></td>
<td>Samsung Galaxy</td>
<td>3.5/5</td>
</tr>
</table>
sample script:
$(function(){
// add multiple select / deselect functionality
$("#selectall").click(function () {
$('.case').attr('checked', this.checked);
});
// if all checkbox are selected, check the selectall checkbox
// and viceversa
$(".case").click(function(){
if($(".case").length == $(".case:checked").length) {
$("#selectall").attr("checked", "checked");
} else {
$("#selectall").removeAttr("checked");
}
});
});

Answer 3

you should set id attr for checkboxes and put row id in the id attr and use the below code for selecting and deselecting:
$(document).ready(function(){
$("#selectall").click(function () {
var isSelect;
if($(this).is(":checked")) {
isSelect=true;
}else{
isSelect=false;
}
$("table tr td input[type=checkbox]").each(function(){
if(isSelect) {
$(this).prop('checked', true);
SelectedItems+=$(this).val()+":";
}else{
$(this).prop('checked', false);
SelectedItems="";
}
$("#Result").html(SelectedItems);
});
});
});

Answer 4

This is my approach of keeping track of all the selected rows in a datatable.
http://www.datatables.net/release-datatables/examples/plug-ins/plugin_api.html
The idea is to check the current page that the user is on and select/deselect the rows that is currently being viewed. You would loop through the page's rows and store the selected row into an array for future reference.
With this approach you would limit the time it takes to select/deselect all rows in the table.
Only show whats needed base on the view that user is seeing.
No hang up because the table is too busy checking/unchecking each row.
//stored checked box list
var result = [];
var selectAll = false;
var table5 = $('#example5').dataTable({
'fnDrawCallback':function(oSettings){
var anNodes = this.oApi._fnGetTrNodes( oSettings );
var anDisplay = $('tbody tr', oSettings.nTable);
//write your logic for pagination
//example
/*
$('tbody tr td:first-child input[type=checkbox]').on('click', function(){
if($(this).is(':checked')){
if($.inArray(....) != -1){push result}
}else{
if($.inArray(....) != -1){splice result}
}
}
if(selectAll){
for(var i = 0; i < anDisplay.length; i++){
//check if it's in result array
//add to the array
}
}else{
for(var i = 0; i < anDisplay.length; i++){
//check if it's in result array
//delete from the array
}
}
*/
}
})
That would be your logic for keeping track of the checked row.