Skip to content

Commit 4a00dac

Browse files
mpryvkinmpryvkin
committed
Fixed #13: Added preliminary support for FixedColumns extension
1 parent 66b089d commit 4a00dac

File tree

2 files changed

+94
-56
lines changed

2 files changed

+94
-56
lines changed

‎js/dataTables.checkboxes.js

Lines changed: 93 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -159,23 +159,26 @@ Checkboxes.prototype = {
159159
if(ctx.aoColumns[i].checkboxes.selectAll){
160160
$(dt.column(i).header())
161161
.html('<input type="checkbox">')
162-
.addClass('dt-checkboxes-select-all');
162+
.addClass('dt-checkboxes-select-all')
163+
.attr('data-col', i);
163164
}
164165
}
165166
}
166167

167168

168169
// If table has at least one checkbox
169170
if(hasCheckboxes){
171+
170172
//
171173
// EVENT HANDLERS
172174
//
175+
173176
var $table = $(dt.table().node());
174-
var $table_body = $(dt.table().body());
175-
var $table_header = $(dt.table().header());
177+
var $tableBody = $(dt.table().body());
178+
var $tableContainer = $(dt.table().container());
176179

177180
// Handles checkbox click event
178-
$table_body.on('click', 'input.dt-checkboxes', function(e){
181+
$tableBody.on('click', 'input.dt-checkboxes', function(e){
179182
self.onClick(e, this);
180183
});
181184

@@ -193,7 +196,7 @@ Checkboxes.prototype = {
193196

194197
// Otherwise, if Select extension is not available
195198
} else {
196-
$table_body.on('click', 'td', function(){
199+
$tableContainer.on('click', 'tbody td', function(){
197200
var $row = $(this).closest('tr');
198201
var e = {
199202
type: ($row.hasClass('selected') ? 'deselect' : 'select')
@@ -219,12 +222,12 @@ Checkboxes.prototype = {
219222
});
220223

221224
// Handle click on "Select all" control
222-
$table_header.on('click', 'th.dt-checkboxes-select-all input[type="checkbox"]', function(e){
225+
$tableContainer.on('click', 'thead th.dt-checkboxes-select-all input[type="checkbox"]', function(e){
223226
self.onClickSelectAll(e, this);
224227
});
225228

226229
// Handle click on heading containing "Select all" control
227-
$table_header.on('click', 'th.dt-checkboxes-select-all', function(e) {
230+
$tableContainer.on('click', 'thead th.dt-checkboxes-select-all', function(e) {
228231
$('input[type="checkbox"]', this).trigger('click');
229232
});
230233
}
@@ -251,9 +254,10 @@ Checkboxes.prototype = {
251254
} else if(type === 'cell'){
252255
nodes = dt.cells(selector).nodes();
253256

254-
dt.cells(nodes).every(function () {
255-
var colIdx = this.index().column;
256-
var rowIdx = this.index().row;
257+
$.each(nodes, function(){
258+
var cellIdx = self.getCellIndex(this);
259+
var colIdx = cellIdx.column;
260+
var rowIdx = cellIdx.row;
257261

258262
// If Checkboxes extension is enabled
259263
// and row selection is enabled for this column
@@ -304,14 +308,17 @@ Checkboxes.prototype = {
304308
nodes = dt.rows(selector).nodes();
305309

306310
} else if(type === 'cell'){
307-
dt.cells(selector).every(function () {
308-
var colIdx = this.index().column;
309-
var rowIdx = this.index().row;
311+
var cellNodes = dt.cells(selector).nodes();
312+
313+
$.each(cellNodes, function(){
314+
var cellIdx = self.getCellIndex(this);
315+
var colIdx = cellIdx.column;
316+
var rowIdx = cellIdx.row;
310317

311318
// If Checkboxes extension is enabled
312319
// and row selection is enabled for this column
313320
if(ctx.aoColumns[colIdx].checkboxes && ctx.aoColumns[colIdx].checkboxes.selectRow){
314-
nodes.push(dt.$(this.node()).closest('tr').get(0));
321+
nodes.push(dt.$(this).closest('tr').get(0));
315322
}
316323
});
317324
}
@@ -361,26 +368,32 @@ Checkboxes.prototype = {
361368
} else if(type === 'cell'){
362369
nodes = dt.cells(selector).nodes();
363370

364-
dt.cells(nodes).every(function(){
365-
var colIdx = this.index().column;
366-
var rowIdx = this.index().row;
371+
$.each(nodes, function(){
372+
var cellIdx = self.getCellIndex(this);
373+
var colIdx = cellIdx.column;
374+
var rowIdx = cellIdx.row;
367375

368376
// If Checkboxes extension is enabled
369377
// and row selection is enabled for this column
370378
if(ctx.aoColumns[colIdx].checkboxes && ctx.aoColumns[colIdx].checkboxes.selectRow){
371379
// Get list of columns other than this cell's column
372380
// where Checkboxes extension is enabled
373-
var columns = $.grep(self.s.columns, function(value){ return value != colIdx; });
381+
// and row selection is enabled
382+
var columns = $.grep(self.s.columns, function(value){
383+
return (value != colIdx) && ctx.aoColumns[value].checkboxes.selectRow;
384+
});
374385

375-
// Add cells from other columns
376-
$.merge(nodes, dt.cells(rowIdx, columns).nodes());
386+
// If there are other columns
387+
if(columns.length){
388+
// Add cells from other columns
389+
$.merge(nodes, dt.cells(rowIdx, columns).nodes());
390+
}
377391
}
378392
});
379393
}
380394

381-
382395
if(nodes.length){
383-
dt.$(nodes).find('input[type="checkbox"]').prop('checked', isSelected);
396+
dt.$(nodes).find('input.dt-checkboxes').prop('checked', isSelected);
384397
}
385398
},
386399

@@ -393,21 +406,17 @@ Checkboxes.prototype = {
393406

394407
// Get cell
395408
var $cell = $(ctrl).closest('td');
396-
var cell = dt.cell($cell);
397409

398-
// REPLACE: dt.cells($cell).checkbox.select()
410+
// TODO: Possibly replace with dt.cells($cell).checkbox.select()
399411

400412
// Get cell's column index
401-
var cellCol = cell.index().column;
402-
403-
// Get cell data
404-
var cellData = cell.data();
413+
var cellIdx = self.getCellIndex($cell);
405414

406415
// If Checkboxes extension is enabled for this column
407-
if(ctx.aoColumns[cellCol].checkboxes){
408-
self.updateCheckbox('cell', $cell, ctrl.checked);
409-
self.updateData('cell', $cell, ctrl.checked);
410-
self.updateSelect('cell', $cell, ctrl.checked);
416+
if(ctx.aoColumns[cellIdx.column].checkboxes){
417+
self.updateCheckbox('cell', cellIdx, ctrl.checked);
418+
self.updateData('cell', cellIdx, ctrl.checked);
419+
self.updateSelect('cell', cellIdx, ctrl.checked);
411420
self.updateSelectAll();
412421

413422
// Prevent click event from propagating to parent
@@ -437,7 +446,16 @@ Checkboxes.prototype = {
437446
var ctx = dt.settings()[0];
438447

439448
// Calculate column index
440-
var col = dt.column($(ctrl).closest('th')).index();
449+
var col = null;
450+
var $th = $(ctrl).closest('th');
451+
452+
// If column is fixed using FixedColumns extension
453+
if($th.parents('.DTFC_Cloned').length){
454+
var cellIdx = dt.fixedColumns().cellIndex($th);
455+
col = cellIdx.column;
456+
} else {
457+
col = dt.column($th).index();
458+
}
441459

442460
var cells = dt.cells('tr', col, {
443461
page: (
@@ -467,6 +485,12 @@ Checkboxes.prototype = {
467485

468486
self.updateSelectAll();
469487

488+
// If column is fixed using FixedColumns extension
489+
if($th.parents('.DTFC_Cloned').length){
490+
// Update columns in the cloned table
491+
dt.fixedColumns().update();
492+
}
493+
470494
e.stopPropagation();
471495
},
472496

@@ -525,31 +549,31 @@ Checkboxes.prototype = {
525549
search: 'applied'
526550
});
527551

528-
var $table = dt.table().container();
529-
var $chkbox_all = dt.$(cells.nodes()).find('input[type="checkbox"]');
530-
var $chkbox_checked = dt.$(cells.nodes()).find('input[type="checkbox"]:checked');
531-
var chkbox_select_all = $('input[type="checkbox"]', dt.column(colIdx).header()).get(0);
552+
var $tableContainer = dt.table().container();
553+
var $checkboxes = dt.$(cells.nodes()).find('.dt-checkboxes');
554+
var $checkboxesChecked = dt.$(cells.nodes()).find('.dt-checkboxes:checked');
555+
var $checkboxesSelectAll = $('.dt-checkboxes-select-all[data-col="' + colIdx + '"] input[type="checkbox"]', $tableContainer);
532556

533557
// If none of the checkboxes are checked
534-
if ($chkbox_checked.length === 0) {
535-
chkbox_select_all.checked = false;
536-
if ('indeterminate' in chkbox_select_all) {
537-
chkbox_select_all.indeterminate = false;
538-
}
558+
if ($checkboxesChecked.length === 0) {
559+
$checkboxesSelectAll.prop({
560+
'checked': false,
561+
'indeterminate': false
562+
});
539563

540564
// If all of the checkboxes are checked
541-
} else if ($chkbox_checked.length === $chkbox_all.length) {
542-
chkbox_select_all.checked = true;
543-
if ('indeterminate' in chkbox_select_all) {
544-
chkbox_select_all.indeterminate = false;
545-
}
565+
} else if ($checkboxesChecked.length === $checkboxes.length) {
566+
$checkboxesSelectAll.prop({
567+
'checked': true,
568+
'indeterminate': false
569+
});
546570

547571
// If some of the checkboxes are checked
548572
} else {
549-
chkbox_select_all.checked = true;
550-
if ('indeterminate' in chkbox_select_all) {
551-
chkbox_select_all.indeterminate = true;
552-
}
573+
$checkboxesSelectAll.prop({
574+
'checked': true,
575+
'indeterminate': true
576+
});
553577
}
554578
}
555579
}
@@ -594,18 +618,32 @@ Checkboxes.prototype = {
594618
$.each( ctx.aanFeatures.i, function ( i, el ) {
595619
var $el = $(el);
596620

597-
var $exisiting = $el.children('span.select-info');
598-
if($exisiting.length){
599-
$exisiting.remove();
621+
var $existing = $el.children('span.select-info');
622+
if($existing.length){
623+
$existing.remove();
600624
}
601625

602626
if($output.text() !== ''){
603627
$el.append($output);
604628
}
605629
});
606630
}
607-
}
631+
},
608632

633+
// Gets cell index
634+
getCellIndex: function(cell){
635+
var self = this;
636+
var dt = self.s.dt;
637+
var ctx = dt.settings()[0];
638+
639+
// If FixedColumns extension is available
640+
if(DataTable.FixedColumns){
641+
return dt.fixedColumns().cellIndex(cell);
642+
643+
} else {
644+
return dt.cell(cell).index();
645+
}
646+
}
609647
};
610648

611649

0 commit comments

Comments
 (0)