datatables.net-select 1.3.4 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/js/dataTables.select.js +80 -27
- package/js/dataTables.select.min.js +4 -40
- package/js/dataTables.select.min.mjs +4 -0
- package/js/dataTables.select.mjs +1282 -0
- package/package.json +4 -2
- package/types/types.d.ts +220 -191
|
@@ -0,0 +1,1282 @@
|
|
|
1
|
+
/*! Select for DataTables 1.5.0
|
|
2
|
+
* 2015-2021 SpryMedia Ltd - datatables.net/license/mit
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
import $ from 'jquery';
|
|
6
|
+
import DataTable from 'datatables.net';
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
// Version information for debugger
|
|
11
|
+
DataTable.select = {};
|
|
12
|
+
|
|
13
|
+
DataTable.select.version = '1.5.0';
|
|
14
|
+
|
|
15
|
+
DataTable.select.init = function ( dt ) {
|
|
16
|
+
var ctx = dt.settings()[0];
|
|
17
|
+
|
|
18
|
+
if (ctx._select) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
var savedSelected = dt.state.loaded();
|
|
23
|
+
|
|
24
|
+
var selectAndSave = function(e, settings, data) {
|
|
25
|
+
if(data === null || data.select === undefined) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// Clear any currently selected rows, before restoring state
|
|
30
|
+
// None will be selected on first initialisation
|
|
31
|
+
if (dt.rows({selected: true}).any()) {
|
|
32
|
+
dt.rows().deselect();
|
|
33
|
+
}
|
|
34
|
+
if (data.select.rows !== undefined) {
|
|
35
|
+
dt.rows(data.select.rows).select();
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
if (dt.columns({selected: true}).any()) {
|
|
39
|
+
dt.columns().deselect();
|
|
40
|
+
}
|
|
41
|
+
if (data.select.columns !== undefined) {
|
|
42
|
+
dt.columns(data.select.columns).select();
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
if (dt.cells({selected: true}).any()) {
|
|
46
|
+
dt.cells().deselect();
|
|
47
|
+
}
|
|
48
|
+
if (data.select.cells !== undefined) {
|
|
49
|
+
for(var i = 0; i < data.select.cells.length; i++) {
|
|
50
|
+
dt.cell(data.select.cells[i].row, data.select.cells[i].column).select();
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
dt.state.save();
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
dt.one('init', function() {
|
|
57
|
+
dt.on('stateSaveParams', function(e, settings, data) {
|
|
58
|
+
data.select = {};
|
|
59
|
+
data.select.rows = dt.rows({selected:true}).ids(true).toArray();
|
|
60
|
+
data.select.columns = dt.columns({selected:true})[0];
|
|
61
|
+
data.select.cells = dt.cells({selected:true})[0].map(function(coords) {
|
|
62
|
+
return {row: dt.row(coords.row).id(true), column: coords.column}
|
|
63
|
+
});
|
|
64
|
+
})
|
|
65
|
+
|
|
66
|
+
selectAndSave(undefined, undefined, savedSelected)
|
|
67
|
+
dt.on('stateLoaded stateLoadParams', selectAndSave)
|
|
68
|
+
})
|
|
69
|
+
|
|
70
|
+
var init = ctx.oInit.select;
|
|
71
|
+
var defaults = DataTable.defaults.select;
|
|
72
|
+
var opts = init === undefined ?
|
|
73
|
+
defaults :
|
|
74
|
+
init;
|
|
75
|
+
|
|
76
|
+
// Set defaults
|
|
77
|
+
var items = 'row';
|
|
78
|
+
var style = 'api';
|
|
79
|
+
var blurable = false;
|
|
80
|
+
var toggleable = true;
|
|
81
|
+
var info = true;
|
|
82
|
+
var selector = 'td, th';
|
|
83
|
+
var className = 'selected';
|
|
84
|
+
var setStyle = false;
|
|
85
|
+
|
|
86
|
+
ctx._select = {};
|
|
87
|
+
|
|
88
|
+
// Initialisation customisations
|
|
89
|
+
if ( opts === true ) {
|
|
90
|
+
style = 'os';
|
|
91
|
+
setStyle = true;
|
|
92
|
+
}
|
|
93
|
+
else if ( typeof opts === 'string' ) {
|
|
94
|
+
style = opts;
|
|
95
|
+
setStyle = true;
|
|
96
|
+
}
|
|
97
|
+
else if ( $.isPlainObject( opts ) ) {
|
|
98
|
+
if ( opts.blurable !== undefined ) {
|
|
99
|
+
blurable = opts.blurable;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
if ( opts.toggleable !== undefined ) {
|
|
103
|
+
toggleable = opts.toggleable;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
if ( opts.info !== undefined ) {
|
|
107
|
+
info = opts.info;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
if ( opts.items !== undefined ) {
|
|
111
|
+
items = opts.items;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
if ( opts.style !== undefined ) {
|
|
115
|
+
style = opts.style;
|
|
116
|
+
setStyle = true;
|
|
117
|
+
}
|
|
118
|
+
else {
|
|
119
|
+
style = 'os';
|
|
120
|
+
setStyle = true;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
if ( opts.selector !== undefined ) {
|
|
124
|
+
selector = opts.selector;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
if ( opts.className !== undefined ) {
|
|
128
|
+
className = opts.className;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
dt.select.selector( selector );
|
|
133
|
+
dt.select.items( items );
|
|
134
|
+
dt.select.style( style );
|
|
135
|
+
dt.select.blurable( blurable );
|
|
136
|
+
dt.select.toggleable( toggleable );
|
|
137
|
+
dt.select.info( info );
|
|
138
|
+
ctx._select.className = className;
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
// Sort table based on selected rows. Requires Select Datatables extension
|
|
142
|
+
$.fn.dataTable.ext.order['select-checkbox'] = function ( settings, col ) {
|
|
143
|
+
return this.api().column( col, {order: 'index'} ).nodes().map( function ( td ) {
|
|
144
|
+
if ( settings._select.items === 'row' ) {
|
|
145
|
+
return $( td ).parent().hasClass( settings._select.className );
|
|
146
|
+
} else if ( settings._select.items === 'cell' ) {
|
|
147
|
+
return $( td ).hasClass( settings._select.className );
|
|
148
|
+
}
|
|
149
|
+
return false;
|
|
150
|
+
});
|
|
151
|
+
};
|
|
152
|
+
|
|
153
|
+
// If the init options haven't enabled select, but there is a selectable
|
|
154
|
+
// class name, then enable
|
|
155
|
+
if ( ! setStyle && $( dt.table().node() ).hasClass( 'selectable' ) ) {
|
|
156
|
+
dt.select.style( 'os' );
|
|
157
|
+
}
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
/*
|
|
161
|
+
|
|
162
|
+
Select is a collection of API methods, event handlers, event emitters and
|
|
163
|
+
buttons (for the `Buttons` extension) for DataTables. It provides the following
|
|
164
|
+
features, with an overview of how they are implemented:
|
|
165
|
+
|
|
166
|
+
## Selection of rows, columns and cells. Whether an item is selected or not is
|
|
167
|
+
stored in:
|
|
168
|
+
|
|
169
|
+
* rows: a `_select_selected` property which contains a boolean value of the
|
|
170
|
+
DataTables' `aoData` object for each row
|
|
171
|
+
* columns: a `_select_selected` property which contains a boolean value of the
|
|
172
|
+
DataTables' `aoColumns` object for each column
|
|
173
|
+
* cells: a `_selected_cells` property which contains an array of boolean values
|
|
174
|
+
of the `aoData` object for each row. The array is the same length as the
|
|
175
|
+
columns array, with each element of it representing a cell.
|
|
176
|
+
|
|
177
|
+
This method of using boolean flags allows Select to operate when nodes have not
|
|
178
|
+
been created for rows / cells (DataTables' defer rendering feature).
|
|
179
|
+
|
|
180
|
+
## API methods
|
|
181
|
+
|
|
182
|
+
A range of API methods are available for triggering selection and de-selection
|
|
183
|
+
of rows. Methods are also available to configure the selection events that can
|
|
184
|
+
be triggered by an end user (such as which items are to be selected). To a large
|
|
185
|
+
extent, these of API methods *is* Select. It is basically a collection of helper
|
|
186
|
+
functions that can be used to select items in a DataTable.
|
|
187
|
+
|
|
188
|
+
Configuration of select is held in the object `_select` which is attached to the
|
|
189
|
+
DataTables settings object on initialisation. Select being available on a table
|
|
190
|
+
is not optional when Select is loaded, but its default is for selection only to
|
|
191
|
+
be available via the API - so the end user wouldn't be able to select rows
|
|
192
|
+
without additional configuration.
|
|
193
|
+
|
|
194
|
+
The `_select` object contains the following properties:
|
|
195
|
+
|
|
196
|
+
```
|
|
197
|
+
{
|
|
198
|
+
items:string - Can be `rows`, `columns` or `cells`. Defines what item
|
|
199
|
+
will be selected if the user is allowed to activate row
|
|
200
|
+
selection using the mouse.
|
|
201
|
+
style:string - Can be `none`, `single`, `multi` or `os`. Defines the
|
|
202
|
+
interaction style when selecting items
|
|
203
|
+
blurable:boolean - If row selection can be cleared by clicking outside of
|
|
204
|
+
the table
|
|
205
|
+
toggleable:boolean - If row selection can be cancelled by repeated clicking
|
|
206
|
+
on the row
|
|
207
|
+
info:boolean - If the selection summary should be shown in the table
|
|
208
|
+
information elements
|
|
209
|
+
}
|
|
210
|
+
```
|
|
211
|
+
|
|
212
|
+
In addition to the API methods, Select also extends the DataTables selector
|
|
213
|
+
options for rows, columns and cells adding a `selected` option to the selector
|
|
214
|
+
options object, allowing the developer to select only selected items or
|
|
215
|
+
unselected items.
|
|
216
|
+
|
|
217
|
+
## Mouse selection of items
|
|
218
|
+
|
|
219
|
+
Clicking on items can be used to select items. This is done by a simple event
|
|
220
|
+
handler that will select the items using the API methods.
|
|
221
|
+
|
|
222
|
+
*/
|
|
223
|
+
|
|
224
|
+
|
|
225
|
+
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
|
226
|
+
* Local functions
|
|
227
|
+
*/
|
|
228
|
+
|
|
229
|
+
/**
|
|
230
|
+
* Add one or more cells to the selection when shift clicking in OS selection
|
|
231
|
+
* style cell selection.
|
|
232
|
+
*
|
|
233
|
+
* Cell range is more complicated than row and column as we want to select
|
|
234
|
+
* in the visible grid rather than by index in sequence. For example, if you
|
|
235
|
+
* click first in cell 1-1 and then shift click in 2-2 - cells 1-2 and 2-1
|
|
236
|
+
* should also be selected (and not 1-3, 1-4. etc)
|
|
237
|
+
*
|
|
238
|
+
* @param {DataTable.Api} dt DataTable
|
|
239
|
+
* @param {object} idx Cell index to select to
|
|
240
|
+
* @param {object} last Cell index to select from
|
|
241
|
+
* @private
|
|
242
|
+
*/
|
|
243
|
+
function cellRange( dt, idx, last )
|
|
244
|
+
{
|
|
245
|
+
var indexes;
|
|
246
|
+
var columnIndexes;
|
|
247
|
+
var rowIndexes;
|
|
248
|
+
var selectColumns = function ( start, end ) {
|
|
249
|
+
if ( start > end ) {
|
|
250
|
+
var tmp = end;
|
|
251
|
+
end = start;
|
|
252
|
+
start = tmp;
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
var record = false;
|
|
256
|
+
return dt.columns( ':visible' ).indexes().filter( function (i) {
|
|
257
|
+
if ( i === start ) {
|
|
258
|
+
record = true;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
if ( i === end ) { // not else if, as start might === end
|
|
262
|
+
record = false;
|
|
263
|
+
return true;
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
return record;
|
|
267
|
+
} );
|
|
268
|
+
};
|
|
269
|
+
|
|
270
|
+
var selectRows = function ( start, end ) {
|
|
271
|
+
var indexes = dt.rows( { search: 'applied' } ).indexes();
|
|
272
|
+
|
|
273
|
+
// Which comes first - might need to swap
|
|
274
|
+
if ( indexes.indexOf( start ) > indexes.indexOf( end ) ) {
|
|
275
|
+
var tmp = end;
|
|
276
|
+
end = start;
|
|
277
|
+
start = tmp;
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
var record = false;
|
|
281
|
+
return indexes.filter( function (i) {
|
|
282
|
+
if ( i === start ) {
|
|
283
|
+
record = true;
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
if ( i === end ) {
|
|
287
|
+
record = false;
|
|
288
|
+
return true;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
return record;
|
|
292
|
+
} );
|
|
293
|
+
};
|
|
294
|
+
|
|
295
|
+
if ( ! dt.cells( { selected: true } ).any() && ! last ) {
|
|
296
|
+
// select from the top left cell to this one
|
|
297
|
+
columnIndexes = selectColumns( 0, idx.column );
|
|
298
|
+
rowIndexes = selectRows( 0 , idx.row );
|
|
299
|
+
}
|
|
300
|
+
else {
|
|
301
|
+
// Get column indexes between old and new
|
|
302
|
+
columnIndexes = selectColumns( last.column, idx.column );
|
|
303
|
+
rowIndexes = selectRows( last.row , idx.row );
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
indexes = dt.cells( rowIndexes, columnIndexes ).flatten();
|
|
307
|
+
|
|
308
|
+
if ( ! dt.cells( idx, { selected: true } ).any() ) {
|
|
309
|
+
// Select range
|
|
310
|
+
dt.cells( indexes ).select();
|
|
311
|
+
}
|
|
312
|
+
else {
|
|
313
|
+
// Deselect range
|
|
314
|
+
dt.cells( indexes ).deselect();
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
|
|
318
|
+
/**
|
|
319
|
+
* Disable mouse selection by removing the selectors
|
|
320
|
+
*
|
|
321
|
+
* @param {DataTable.Api} dt DataTable to remove events from
|
|
322
|
+
* @private
|
|
323
|
+
*/
|
|
324
|
+
function disableMouseSelection( dt )
|
|
325
|
+
{
|
|
326
|
+
var ctx = dt.settings()[0];
|
|
327
|
+
var selector = ctx._select.selector;
|
|
328
|
+
|
|
329
|
+
$( dt.table().container() )
|
|
330
|
+
.off( 'mousedown.dtSelect', selector )
|
|
331
|
+
.off( 'mouseup.dtSelect', selector )
|
|
332
|
+
.off( 'click.dtSelect', selector );
|
|
333
|
+
|
|
334
|
+
$('body').off( 'click.dtSelect' + _safeId(dt.table().node()) );
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
/**
|
|
338
|
+
* Attach mouse listeners to the table to allow mouse selection of items
|
|
339
|
+
*
|
|
340
|
+
* @param {DataTable.Api} dt DataTable to remove events from
|
|
341
|
+
* @private
|
|
342
|
+
*/
|
|
343
|
+
function enableMouseSelection ( dt )
|
|
344
|
+
{
|
|
345
|
+
var container = $( dt.table().container() );
|
|
346
|
+
var ctx = dt.settings()[0];
|
|
347
|
+
var selector = ctx._select.selector;
|
|
348
|
+
var matchSelection;
|
|
349
|
+
|
|
350
|
+
container
|
|
351
|
+
.on( 'mousedown.dtSelect', selector, function(e) {
|
|
352
|
+
// Disallow text selection for shift clicking on the table so multi
|
|
353
|
+
// element selection doesn't look terrible!
|
|
354
|
+
if ( e.shiftKey || e.metaKey || e.ctrlKey ) {
|
|
355
|
+
container
|
|
356
|
+
.css( '-moz-user-select', 'none' )
|
|
357
|
+
.one('selectstart.dtSelect', selector, function () {
|
|
358
|
+
return false;
|
|
359
|
+
} );
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
if ( window.getSelection ) {
|
|
363
|
+
matchSelection = window.getSelection();
|
|
364
|
+
}
|
|
365
|
+
} )
|
|
366
|
+
.on( 'mouseup.dtSelect', selector, function() {
|
|
367
|
+
// Allow text selection to occur again, Mozilla style (tested in FF
|
|
368
|
+
// 35.0.1 - still required)
|
|
369
|
+
container.css( '-moz-user-select', '' );
|
|
370
|
+
} )
|
|
371
|
+
.on( 'click.dtSelect', selector, function ( e ) {
|
|
372
|
+
var items = dt.select.items();
|
|
373
|
+
var idx;
|
|
374
|
+
|
|
375
|
+
// If text was selected (click and drag), then we shouldn't change
|
|
376
|
+
// the row's selected state
|
|
377
|
+
if ( matchSelection ) {
|
|
378
|
+
var selection = window.getSelection();
|
|
379
|
+
|
|
380
|
+
// If the element that contains the selection is not in the table, we can ignore it
|
|
381
|
+
// This can happen if the developer selects text from the click event
|
|
382
|
+
if ( ! selection.anchorNode || $(selection.anchorNode).closest('table')[0] === dt.table().node() ) {
|
|
383
|
+
if ( selection !== matchSelection ) {
|
|
384
|
+
return;
|
|
385
|
+
}
|
|
386
|
+
}
|
|
387
|
+
}
|
|
388
|
+
|
|
389
|
+
var ctx = dt.settings()[0];
|
|
390
|
+
var wrapperClass = dt.settings()[0].oClasses.sWrapper.trim().replace(/ +/g, '.');
|
|
391
|
+
|
|
392
|
+
// Ignore clicks inside a sub-table
|
|
393
|
+
if ( $(e.target).closest('div.'+wrapperClass)[0] != dt.table().container() ) {
|
|
394
|
+
return;
|
|
395
|
+
}
|
|
396
|
+
|
|
397
|
+
var cell = dt.cell( $(e.target).closest('td, th') );
|
|
398
|
+
|
|
399
|
+
// Check the cell actually belongs to the host DataTable (so child
|
|
400
|
+
// rows, etc, are ignored)
|
|
401
|
+
if ( ! cell.any() ) {
|
|
402
|
+
return;
|
|
403
|
+
}
|
|
404
|
+
|
|
405
|
+
var event = $.Event('user-select.dt');
|
|
406
|
+
eventTrigger( dt, event, [ items, cell, e ] );
|
|
407
|
+
|
|
408
|
+
if ( event.isDefaultPrevented() ) {
|
|
409
|
+
return;
|
|
410
|
+
}
|
|
411
|
+
|
|
412
|
+
var cellIndex = cell.index();
|
|
413
|
+
if ( items === 'row' ) {
|
|
414
|
+
idx = cellIndex.row;
|
|
415
|
+
typeSelect( e, dt, ctx, 'row', idx );
|
|
416
|
+
}
|
|
417
|
+
else if ( items === 'column' ) {
|
|
418
|
+
idx = cell.index().column;
|
|
419
|
+
typeSelect( e, dt, ctx, 'column', idx );
|
|
420
|
+
}
|
|
421
|
+
else if ( items === 'cell' ) {
|
|
422
|
+
idx = cell.index();
|
|
423
|
+
typeSelect( e, dt, ctx, 'cell', idx );
|
|
424
|
+
}
|
|
425
|
+
|
|
426
|
+
ctx._select_lastCell = cellIndex;
|
|
427
|
+
} );
|
|
428
|
+
|
|
429
|
+
// Blurable
|
|
430
|
+
$('body').on( 'click.dtSelect' + _safeId(dt.table().node()), function ( e ) {
|
|
431
|
+
if ( ctx._select.blurable ) {
|
|
432
|
+
// If the click was inside the DataTables container, don't blur
|
|
433
|
+
if ( $(e.target).parents().filter( dt.table().container() ).length ) {
|
|
434
|
+
return;
|
|
435
|
+
}
|
|
436
|
+
|
|
437
|
+
// Ignore elements which have been removed from the DOM (i.e. paging
|
|
438
|
+
// buttons)
|
|
439
|
+
if ( $(e.target).parents('html').length === 0 ) {
|
|
440
|
+
return;
|
|
441
|
+
}
|
|
442
|
+
|
|
443
|
+
// Don't blur in Editor form
|
|
444
|
+
if ( $(e.target).parents('div.DTE').length ) {
|
|
445
|
+
return;
|
|
446
|
+
}
|
|
447
|
+
|
|
448
|
+
var event = $.Event('select-blur.dt');
|
|
449
|
+
eventTrigger( dt, event, [ e.target, e ] );
|
|
450
|
+
|
|
451
|
+
if ( event.isDefaultPrevented() ) {
|
|
452
|
+
return;
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
clear( ctx, true );
|
|
456
|
+
}
|
|
457
|
+
} );
|
|
458
|
+
}
|
|
459
|
+
|
|
460
|
+
/**
|
|
461
|
+
* Trigger an event on a DataTable
|
|
462
|
+
*
|
|
463
|
+
* @param {DataTable.Api} api DataTable to trigger events on
|
|
464
|
+
* @param {boolean} selected true if selected, false if deselected
|
|
465
|
+
* @param {string} type Item type acting on
|
|
466
|
+
* @param {boolean} any Require that there are values before
|
|
467
|
+
* triggering
|
|
468
|
+
* @private
|
|
469
|
+
*/
|
|
470
|
+
function eventTrigger ( api, type, args, any )
|
|
471
|
+
{
|
|
472
|
+
if ( any && ! api.flatten().length ) {
|
|
473
|
+
return;
|
|
474
|
+
}
|
|
475
|
+
|
|
476
|
+
if ( typeof type === 'string' ) {
|
|
477
|
+
type = type +'.dt';
|
|
478
|
+
}
|
|
479
|
+
|
|
480
|
+
args.unshift( api );
|
|
481
|
+
|
|
482
|
+
$(api.table().node()).trigger( type, args );
|
|
483
|
+
}
|
|
484
|
+
|
|
485
|
+
/**
|
|
486
|
+
* Update the information element of the DataTable showing information about the
|
|
487
|
+
* items selected. This is done by adding tags to the existing text
|
|
488
|
+
*
|
|
489
|
+
* @param {DataTable.Api} api DataTable to update
|
|
490
|
+
* @private
|
|
491
|
+
*/
|
|
492
|
+
function info ( api )
|
|
493
|
+
{
|
|
494
|
+
var ctx = api.settings()[0];
|
|
495
|
+
|
|
496
|
+
if ( ! ctx._select.info || ! ctx.aanFeatures.i ) {
|
|
497
|
+
return;
|
|
498
|
+
}
|
|
499
|
+
|
|
500
|
+
if ( api.select.style() === 'api' ) {
|
|
501
|
+
return;
|
|
502
|
+
}
|
|
503
|
+
|
|
504
|
+
var rows = api.rows( { selected: true } ).flatten().length;
|
|
505
|
+
var columns = api.columns( { selected: true } ).flatten().length;
|
|
506
|
+
var cells = api.cells( { selected: true } ).flatten().length;
|
|
507
|
+
|
|
508
|
+
var add = function ( el, name, num ) {
|
|
509
|
+
el.append( $('<span class="select-item"/>').append( api.i18n(
|
|
510
|
+
'select.'+name+'s',
|
|
511
|
+
{ _: '%d '+name+'s selected', 0: '', 1: '1 '+name+' selected' },
|
|
512
|
+
num
|
|
513
|
+
) ) );
|
|
514
|
+
};
|
|
515
|
+
|
|
516
|
+
// Internal knowledge of DataTables to loop over all information elements
|
|
517
|
+
$.each( ctx.aanFeatures.i, function ( i, el ) {
|
|
518
|
+
el = $(el);
|
|
519
|
+
|
|
520
|
+
var output = $('<span class="select-info"/>');
|
|
521
|
+
add( output, 'row', rows );
|
|
522
|
+
add( output, 'column', columns );
|
|
523
|
+
add( output, 'cell', cells );
|
|
524
|
+
|
|
525
|
+
var exisiting = el.children('span.select-info');
|
|
526
|
+
if ( exisiting.length ) {
|
|
527
|
+
exisiting.remove();
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
if ( output.text() !== '' ) {
|
|
531
|
+
el.append( output );
|
|
532
|
+
}
|
|
533
|
+
} );
|
|
534
|
+
}
|
|
535
|
+
|
|
536
|
+
/**
|
|
537
|
+
* Initialisation of a new table. Attach event handlers and callbacks to allow
|
|
538
|
+
* Select to operate correctly.
|
|
539
|
+
*
|
|
540
|
+
* This will occur _after_ the initial DataTables initialisation, although
|
|
541
|
+
* before Ajax data is rendered, if there is ajax data
|
|
542
|
+
*
|
|
543
|
+
* @param {DataTable.settings} ctx Settings object to operate on
|
|
544
|
+
* @private
|
|
545
|
+
*/
|
|
546
|
+
function init ( ctx ) {
|
|
547
|
+
var api = new DataTable.Api( ctx );
|
|
548
|
+
ctx._select_init = true;
|
|
549
|
+
|
|
550
|
+
// Row callback so that classes can be added to rows and cells if the item
|
|
551
|
+
// was selected before the element was created. This will happen with the
|
|
552
|
+
// `deferRender` option enabled.
|
|
553
|
+
//
|
|
554
|
+
// This method of attaching to `aoRowCreatedCallback` is a hack until
|
|
555
|
+
// DataTables has proper events for row manipulation If you are reviewing
|
|
556
|
+
// this code to create your own plug-ins, please do not do this!
|
|
557
|
+
ctx.aoRowCreatedCallback.push( {
|
|
558
|
+
fn: function ( row, data, index ) {
|
|
559
|
+
var i, ien;
|
|
560
|
+
var d = ctx.aoData[ index ];
|
|
561
|
+
|
|
562
|
+
// Row
|
|
563
|
+
if ( d._select_selected ) {
|
|
564
|
+
$( row ).addClass( ctx._select.className );
|
|
565
|
+
}
|
|
566
|
+
|
|
567
|
+
// Cells and columns - if separated out, we would need to do two
|
|
568
|
+
// loops, so it makes sense to combine them into a single one
|
|
569
|
+
for ( i=0, ien=ctx.aoColumns.length ; i<ien ; i++ ) {
|
|
570
|
+
if ( ctx.aoColumns[i]._select_selected || (d._selected_cells && d._selected_cells[i]) ) {
|
|
571
|
+
$(d.anCells[i]).addClass( ctx._select.className );
|
|
572
|
+
}
|
|
573
|
+
}
|
|
574
|
+
},
|
|
575
|
+
sName: 'select-deferRender'
|
|
576
|
+
} );
|
|
577
|
+
|
|
578
|
+
// On Ajax reload we want to reselect all rows which are currently selected,
|
|
579
|
+
// if there is an rowId (i.e. a unique value to identify each row with)
|
|
580
|
+
api.on( 'preXhr.dt.dtSelect', function (e, settings) {
|
|
581
|
+
if (settings !== api.settings()[0]) {
|
|
582
|
+
// Not triggered by our DataTable!
|
|
583
|
+
return;
|
|
584
|
+
}
|
|
585
|
+
|
|
586
|
+
// note that column selection doesn't need to be cached and then
|
|
587
|
+
// reselected, as they are already selected
|
|
588
|
+
var rows = api.rows( { selected: true } ).ids( true ).filter( function ( d ) {
|
|
589
|
+
return d !== undefined;
|
|
590
|
+
} );
|
|
591
|
+
|
|
592
|
+
var cells = api.cells( { selected: true } ).eq(0).map( function ( cellIdx ) {
|
|
593
|
+
var id = api.row( cellIdx.row ).id( true );
|
|
594
|
+
return id ?
|
|
595
|
+
{ row: id, column: cellIdx.column } :
|
|
596
|
+
undefined;
|
|
597
|
+
} ).filter( function ( d ) {
|
|
598
|
+
return d !== undefined;
|
|
599
|
+
} );
|
|
600
|
+
|
|
601
|
+
// On the next draw, reselect the currently selected items
|
|
602
|
+
api.one( 'draw.dt.dtSelect', function () {
|
|
603
|
+
api.rows( rows ).select();
|
|
604
|
+
|
|
605
|
+
// `cells` is not a cell index selector, so it needs a loop
|
|
606
|
+
if ( cells.any() ) {
|
|
607
|
+
cells.each( function ( id ) {
|
|
608
|
+
api.cells( id.row, id.column ).select();
|
|
609
|
+
} );
|
|
610
|
+
}
|
|
611
|
+
} );
|
|
612
|
+
} );
|
|
613
|
+
|
|
614
|
+
// Update the table information element with selected item summary
|
|
615
|
+
api.on( 'draw.dtSelect.dt select.dtSelect.dt deselect.dtSelect.dt info.dt', function () {
|
|
616
|
+
info( api );
|
|
617
|
+
api.state.save();
|
|
618
|
+
} );
|
|
619
|
+
|
|
620
|
+
// Clean up and release
|
|
621
|
+
api.on( 'destroy.dtSelect', function () {
|
|
622
|
+
api.rows({selected: true}).deselect();
|
|
623
|
+
|
|
624
|
+
disableMouseSelection( api );
|
|
625
|
+
api.off( '.dtSelect' );
|
|
626
|
+
$('body').off('.dtSelect' + _safeId(api.table().node()));
|
|
627
|
+
} );
|
|
628
|
+
}
|
|
629
|
+
|
|
630
|
+
/**
|
|
631
|
+
* Add one or more items (rows or columns) to the selection when shift clicking
|
|
632
|
+
* in OS selection style
|
|
633
|
+
*
|
|
634
|
+
* @param {DataTable.Api} dt DataTable
|
|
635
|
+
* @param {string} type Row or column range selector
|
|
636
|
+
* @param {object} idx Item index to select to
|
|
637
|
+
* @param {object} last Item index to select from
|
|
638
|
+
* @private
|
|
639
|
+
*/
|
|
640
|
+
function rowColumnRange( dt, type, idx, last )
|
|
641
|
+
{
|
|
642
|
+
// Add a range of rows from the last selected row to this one
|
|
643
|
+
var indexes = dt[type+'s']( { search: 'applied' } ).indexes();
|
|
644
|
+
var idx1 = $.inArray( last, indexes );
|
|
645
|
+
var idx2 = $.inArray( idx, indexes );
|
|
646
|
+
|
|
647
|
+
if ( ! dt[type+'s']( { selected: true } ).any() && idx1 === -1 ) {
|
|
648
|
+
// select from top to here - slightly odd, but both Windows and Mac OS
|
|
649
|
+
// do this
|
|
650
|
+
indexes.splice( $.inArray( idx, indexes )+1, indexes.length );
|
|
651
|
+
}
|
|
652
|
+
else {
|
|
653
|
+
// reverse so we can shift click 'up' as well as down
|
|
654
|
+
if ( idx1 > idx2 ) {
|
|
655
|
+
var tmp = idx2;
|
|
656
|
+
idx2 = idx1;
|
|
657
|
+
idx1 = tmp;
|
|
658
|
+
}
|
|
659
|
+
|
|
660
|
+
indexes.splice( idx2+1, indexes.length );
|
|
661
|
+
indexes.splice( 0, idx1 );
|
|
662
|
+
}
|
|
663
|
+
|
|
664
|
+
if ( ! dt[type]( idx, { selected: true } ).any() ) {
|
|
665
|
+
// Select range
|
|
666
|
+
dt[type+'s']( indexes ).select();
|
|
667
|
+
}
|
|
668
|
+
else {
|
|
669
|
+
// Deselect range - need to keep the clicked on row selected
|
|
670
|
+
indexes.splice( $.inArray( idx, indexes ), 1 );
|
|
671
|
+
dt[type+'s']( indexes ).deselect();
|
|
672
|
+
}
|
|
673
|
+
}
|
|
674
|
+
|
|
675
|
+
/**
|
|
676
|
+
* Clear all selected items
|
|
677
|
+
*
|
|
678
|
+
* @param {DataTable.settings} ctx Settings object of the host DataTable
|
|
679
|
+
* @param {boolean} [force=false] Force the de-selection to happen, regardless
|
|
680
|
+
* of selection style
|
|
681
|
+
* @private
|
|
682
|
+
*/
|
|
683
|
+
function clear( ctx, force )
|
|
684
|
+
{
|
|
685
|
+
if ( force || ctx._select.style === 'single' ) {
|
|
686
|
+
var api = new DataTable.Api( ctx );
|
|
687
|
+
|
|
688
|
+
api.rows( { selected: true } ).deselect();
|
|
689
|
+
api.columns( { selected: true } ).deselect();
|
|
690
|
+
api.cells( { selected: true } ).deselect();
|
|
691
|
+
}
|
|
692
|
+
}
|
|
693
|
+
|
|
694
|
+
/**
|
|
695
|
+
* Select items based on the current configuration for style and items.
|
|
696
|
+
*
|
|
697
|
+
* @param {object} e Mouse event object
|
|
698
|
+
* @param {DataTables.Api} dt DataTable
|
|
699
|
+
* @param {DataTable.settings} ctx Settings object of the host DataTable
|
|
700
|
+
* @param {string} type Items to select
|
|
701
|
+
* @param {int|object} idx Index of the item to select
|
|
702
|
+
* @private
|
|
703
|
+
*/
|
|
704
|
+
function typeSelect ( e, dt, ctx, type, idx )
|
|
705
|
+
{
|
|
706
|
+
var style = dt.select.style();
|
|
707
|
+
var toggleable = dt.select.toggleable();
|
|
708
|
+
var isSelected = dt[type]( idx, { selected: true } ).any();
|
|
709
|
+
|
|
710
|
+
if ( isSelected && ! toggleable ) {
|
|
711
|
+
return;
|
|
712
|
+
}
|
|
713
|
+
|
|
714
|
+
if ( style === 'os' ) {
|
|
715
|
+
if ( e.ctrlKey || e.metaKey ) {
|
|
716
|
+
// Add or remove from the selection
|
|
717
|
+
dt[type]( idx ).select( ! isSelected );
|
|
718
|
+
}
|
|
719
|
+
else if ( e.shiftKey ) {
|
|
720
|
+
if ( type === 'cell' ) {
|
|
721
|
+
cellRange( dt, idx, ctx._select_lastCell || null );
|
|
722
|
+
}
|
|
723
|
+
else {
|
|
724
|
+
rowColumnRange( dt, type, idx, ctx._select_lastCell ?
|
|
725
|
+
ctx._select_lastCell[type] :
|
|
726
|
+
null
|
|
727
|
+
);
|
|
728
|
+
}
|
|
729
|
+
}
|
|
730
|
+
else {
|
|
731
|
+
// No cmd or shift click - deselect if selected, or select
|
|
732
|
+
// this row only
|
|
733
|
+
var selected = dt[type+'s']( { selected: true } );
|
|
734
|
+
|
|
735
|
+
if ( isSelected && selected.flatten().length === 1 ) {
|
|
736
|
+
dt[type]( idx ).deselect();
|
|
737
|
+
}
|
|
738
|
+
else {
|
|
739
|
+
selected.deselect();
|
|
740
|
+
dt[type]( idx ).select();
|
|
741
|
+
}
|
|
742
|
+
}
|
|
743
|
+
} else if ( style == 'multi+shift' ) {
|
|
744
|
+
if ( e.shiftKey ) {
|
|
745
|
+
if ( type === 'cell' ) {
|
|
746
|
+
cellRange( dt, idx, ctx._select_lastCell || null );
|
|
747
|
+
}
|
|
748
|
+
else {
|
|
749
|
+
rowColumnRange( dt, type, idx, ctx._select_lastCell ?
|
|
750
|
+
ctx._select_lastCell[type] :
|
|
751
|
+
null
|
|
752
|
+
);
|
|
753
|
+
}
|
|
754
|
+
}
|
|
755
|
+
else {
|
|
756
|
+
dt[ type ]( idx ).select( ! isSelected );
|
|
757
|
+
}
|
|
758
|
+
}
|
|
759
|
+
else {
|
|
760
|
+
dt[ type ]( idx ).select( ! isSelected );
|
|
761
|
+
}
|
|
762
|
+
}
|
|
763
|
+
|
|
764
|
+
function _safeId( node ) {
|
|
765
|
+
return node.id.replace(/[^a-zA-Z0-9\-\_]/g, '-');
|
|
766
|
+
}
|
|
767
|
+
|
|
768
|
+
|
|
769
|
+
|
|
770
|
+
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
|
771
|
+
* DataTables selectors
|
|
772
|
+
*/
|
|
773
|
+
|
|
774
|
+
// row and column are basically identical just assigned to different properties
|
|
775
|
+
// and checking a different array, so we can dynamically create the functions to
|
|
776
|
+
// reduce the code size
|
|
777
|
+
$.each( [
|
|
778
|
+
{ type: 'row', prop: 'aoData' },
|
|
779
|
+
{ type: 'column', prop: 'aoColumns' }
|
|
780
|
+
], function ( i, o ) {
|
|
781
|
+
DataTable.ext.selector[ o.type ].push( function ( settings, opts, indexes ) {
|
|
782
|
+
var selected = opts.selected;
|
|
783
|
+
var data;
|
|
784
|
+
var out = [];
|
|
785
|
+
|
|
786
|
+
if ( selected !== true && selected !== false ) {
|
|
787
|
+
return indexes;
|
|
788
|
+
}
|
|
789
|
+
|
|
790
|
+
for ( var i=0, ien=indexes.length ; i<ien ; i++ ) {
|
|
791
|
+
data = settings[ o.prop ][ indexes[i] ];
|
|
792
|
+
|
|
793
|
+
if ( (selected === true && data._select_selected === true) ||
|
|
794
|
+
(selected === false && ! data._select_selected )
|
|
795
|
+
) {
|
|
796
|
+
out.push( indexes[i] );
|
|
797
|
+
}
|
|
798
|
+
}
|
|
799
|
+
|
|
800
|
+
return out;
|
|
801
|
+
} );
|
|
802
|
+
} );
|
|
803
|
+
|
|
804
|
+
DataTable.ext.selector.cell.push( function ( settings, opts, cells ) {
|
|
805
|
+
var selected = opts.selected;
|
|
806
|
+
var rowData;
|
|
807
|
+
var out = [];
|
|
808
|
+
|
|
809
|
+
if ( selected === undefined ) {
|
|
810
|
+
return cells;
|
|
811
|
+
}
|
|
812
|
+
|
|
813
|
+
for ( var i=0, ien=cells.length ; i<ien ; i++ ) {
|
|
814
|
+
rowData = settings.aoData[ cells[i].row ];
|
|
815
|
+
|
|
816
|
+
if ( (selected === true && rowData._selected_cells && rowData._selected_cells[ cells[i].column ] === true) ||
|
|
817
|
+
(selected === false && ( ! rowData._selected_cells || ! rowData._selected_cells[ cells[i].column ] ) )
|
|
818
|
+
) {
|
|
819
|
+
out.push( cells[i] );
|
|
820
|
+
}
|
|
821
|
+
}
|
|
822
|
+
|
|
823
|
+
return out;
|
|
824
|
+
} );
|
|
825
|
+
|
|
826
|
+
|
|
827
|
+
|
|
828
|
+
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
|
829
|
+
* DataTables API
|
|
830
|
+
*
|
|
831
|
+
* For complete documentation, please refer to the docs/api directory or the
|
|
832
|
+
* DataTables site
|
|
833
|
+
*/
|
|
834
|
+
|
|
835
|
+
// Local variables to improve compression
|
|
836
|
+
var apiRegister = DataTable.Api.register;
|
|
837
|
+
var apiRegisterPlural = DataTable.Api.registerPlural;
|
|
838
|
+
|
|
839
|
+
apiRegister( 'select()', function () {
|
|
840
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
841
|
+
DataTable.select.init( new DataTable.Api( ctx ) );
|
|
842
|
+
} );
|
|
843
|
+
} );
|
|
844
|
+
|
|
845
|
+
apiRegister( 'select.blurable()', function ( flag ) {
|
|
846
|
+
if ( flag === undefined ) {
|
|
847
|
+
return this.context[0]._select.blurable;
|
|
848
|
+
}
|
|
849
|
+
|
|
850
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
851
|
+
ctx._select.blurable = flag;
|
|
852
|
+
} );
|
|
853
|
+
} );
|
|
854
|
+
|
|
855
|
+
apiRegister( 'select.toggleable()', function ( flag ) {
|
|
856
|
+
if ( flag === undefined ) {
|
|
857
|
+
return this.context[0]._select.toggleable;
|
|
858
|
+
}
|
|
859
|
+
|
|
860
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
861
|
+
ctx._select.toggleable = flag;
|
|
862
|
+
} );
|
|
863
|
+
} );
|
|
864
|
+
|
|
865
|
+
apiRegister( 'select.info()', function ( flag ) {
|
|
866
|
+
if ( flag === undefined ) {
|
|
867
|
+
return this.context[0]._select.info;
|
|
868
|
+
}
|
|
869
|
+
|
|
870
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
871
|
+
ctx._select.info = flag;
|
|
872
|
+
} );
|
|
873
|
+
} );
|
|
874
|
+
|
|
875
|
+
apiRegister( 'select.items()', function ( items ) {
|
|
876
|
+
if ( items === undefined ) {
|
|
877
|
+
return this.context[0]._select.items;
|
|
878
|
+
}
|
|
879
|
+
|
|
880
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
881
|
+
ctx._select.items = items;
|
|
882
|
+
|
|
883
|
+
eventTrigger( new DataTable.Api( ctx ), 'selectItems', [ items ] );
|
|
884
|
+
} );
|
|
885
|
+
} );
|
|
886
|
+
|
|
887
|
+
// Takes effect from the _next_ selection. None disables future selection, but
|
|
888
|
+
// does not clear the current selection. Use the `deselect` methods for that
|
|
889
|
+
apiRegister( 'select.style()', function ( style ) {
|
|
890
|
+
if ( style === undefined ) {
|
|
891
|
+
return this.context[0]._select.style;
|
|
892
|
+
}
|
|
893
|
+
|
|
894
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
895
|
+
if ( ! ctx._select ) {
|
|
896
|
+
DataTable.select.init( new DataTable.Api(ctx) );
|
|
897
|
+
}
|
|
898
|
+
|
|
899
|
+
if ( ! ctx._select_init ) {
|
|
900
|
+
init(ctx);
|
|
901
|
+
}
|
|
902
|
+
|
|
903
|
+
ctx._select.style = style;
|
|
904
|
+
|
|
905
|
+
// Add / remove mouse event handlers. They aren't required when only
|
|
906
|
+
// API selection is available
|
|
907
|
+
var dt = new DataTable.Api( ctx );
|
|
908
|
+
disableMouseSelection( dt );
|
|
909
|
+
|
|
910
|
+
if ( style !== 'api' ) {
|
|
911
|
+
enableMouseSelection( dt );
|
|
912
|
+
}
|
|
913
|
+
|
|
914
|
+
eventTrigger( new DataTable.Api( ctx ), 'selectStyle', [ style ] );
|
|
915
|
+
} );
|
|
916
|
+
} );
|
|
917
|
+
|
|
918
|
+
apiRegister( 'select.selector()', function ( selector ) {
|
|
919
|
+
if ( selector === undefined ) {
|
|
920
|
+
return this.context[0]._select.selector;
|
|
921
|
+
}
|
|
922
|
+
|
|
923
|
+
return this.iterator( 'table', function ( ctx ) {
|
|
924
|
+
disableMouseSelection( new DataTable.Api( ctx ) );
|
|
925
|
+
|
|
926
|
+
ctx._select.selector = selector;
|
|
927
|
+
|
|
928
|
+
if ( ctx._select.style !== 'api' ) {
|
|
929
|
+
enableMouseSelection( new DataTable.Api( ctx ) );
|
|
930
|
+
}
|
|
931
|
+
} );
|
|
932
|
+
} );
|
|
933
|
+
|
|
934
|
+
|
|
935
|
+
|
|
936
|
+
apiRegisterPlural( 'rows().select()', 'row().select()', function ( select ) {
|
|
937
|
+
var api = this;
|
|
938
|
+
|
|
939
|
+
if ( select === false ) {
|
|
940
|
+
return this.deselect();
|
|
941
|
+
}
|
|
942
|
+
|
|
943
|
+
this.iterator( 'row', function ( ctx, idx ) {
|
|
944
|
+
clear( ctx );
|
|
945
|
+
|
|
946
|
+
ctx.aoData[ idx ]._select_selected = true;
|
|
947
|
+
$( ctx.aoData[ idx ].nTr ).addClass( ctx._select.className );
|
|
948
|
+
} );
|
|
949
|
+
|
|
950
|
+
this.iterator( 'table', function ( ctx, i ) {
|
|
951
|
+
eventTrigger( api, 'select', [ 'row', api[i] ], true );
|
|
952
|
+
} );
|
|
953
|
+
|
|
954
|
+
return this;
|
|
955
|
+
} );
|
|
956
|
+
|
|
957
|
+
apiRegister( 'row().selected()', function () {
|
|
958
|
+
var ctx = this.context[0];
|
|
959
|
+
|
|
960
|
+
if (
|
|
961
|
+
ctx &&
|
|
962
|
+
this.length &&
|
|
963
|
+
ctx.aoData[this[0]] &&
|
|
964
|
+
ctx.aoData[this[0]]._select_selected
|
|
965
|
+
) {
|
|
966
|
+
return true;
|
|
967
|
+
}
|
|
968
|
+
|
|
969
|
+
return false;
|
|
970
|
+
} );
|
|
971
|
+
|
|
972
|
+
apiRegisterPlural( 'columns().select()', 'column().select()', function ( select ) {
|
|
973
|
+
var api = this;
|
|
974
|
+
|
|
975
|
+
if ( select === false ) {
|
|
976
|
+
return this.deselect();
|
|
977
|
+
}
|
|
978
|
+
|
|
979
|
+
this.iterator( 'column', function ( ctx, idx ) {
|
|
980
|
+
clear( ctx );
|
|
981
|
+
|
|
982
|
+
ctx.aoColumns[ idx ]._select_selected = true;
|
|
983
|
+
|
|
984
|
+
var column = new DataTable.Api( ctx ).column( idx );
|
|
985
|
+
|
|
986
|
+
$( column.header() ).addClass( ctx._select.className );
|
|
987
|
+
$( column.footer() ).addClass( ctx._select.className );
|
|
988
|
+
|
|
989
|
+
column.nodes().to$().addClass( ctx._select.className );
|
|
990
|
+
} );
|
|
991
|
+
|
|
992
|
+
this.iterator( 'table', function ( ctx, i ) {
|
|
993
|
+
eventTrigger( api, 'select', [ 'column', api[i] ], true );
|
|
994
|
+
} );
|
|
995
|
+
|
|
996
|
+
return this;
|
|
997
|
+
} );
|
|
998
|
+
|
|
999
|
+
apiRegister( 'column().selected()', function () {
|
|
1000
|
+
var ctx = this.context[0];
|
|
1001
|
+
|
|
1002
|
+
if (
|
|
1003
|
+
ctx &&
|
|
1004
|
+
this.length &&
|
|
1005
|
+
ctx.aoColumns[this[0]] &&
|
|
1006
|
+
ctx.aoColumns[this[0]]._select_selected
|
|
1007
|
+
) {
|
|
1008
|
+
return true;
|
|
1009
|
+
}
|
|
1010
|
+
|
|
1011
|
+
return false;
|
|
1012
|
+
} );
|
|
1013
|
+
|
|
1014
|
+
apiRegisterPlural( 'cells().select()', 'cell().select()', function ( select ) {
|
|
1015
|
+
var api = this;
|
|
1016
|
+
|
|
1017
|
+
if ( select === false ) {
|
|
1018
|
+
return this.deselect();
|
|
1019
|
+
}
|
|
1020
|
+
|
|
1021
|
+
this.iterator( 'cell', function ( ctx, rowIdx, colIdx ) {
|
|
1022
|
+
clear( ctx );
|
|
1023
|
+
|
|
1024
|
+
var data = ctx.aoData[ rowIdx ];
|
|
1025
|
+
|
|
1026
|
+
if ( data._selected_cells === undefined ) {
|
|
1027
|
+
data._selected_cells = [];
|
|
1028
|
+
}
|
|
1029
|
+
|
|
1030
|
+
data._selected_cells[ colIdx ] = true;
|
|
1031
|
+
|
|
1032
|
+
if ( data.anCells ) {
|
|
1033
|
+
$( data.anCells[ colIdx ] ).addClass( ctx._select.className );
|
|
1034
|
+
}
|
|
1035
|
+
} );
|
|
1036
|
+
|
|
1037
|
+
this.iterator( 'table', function ( ctx, i ) {
|
|
1038
|
+
eventTrigger( api, 'select', [ 'cell', api.cells(api[i]).indexes().toArray() ], true );
|
|
1039
|
+
} );
|
|
1040
|
+
|
|
1041
|
+
return this;
|
|
1042
|
+
} );
|
|
1043
|
+
|
|
1044
|
+
apiRegister( 'cell().selected()', function () {
|
|
1045
|
+
var ctx = this.context[0];
|
|
1046
|
+
|
|
1047
|
+
if (ctx && this.length) {
|
|
1048
|
+
var row = ctx.aoData[this[0][0].row];
|
|
1049
|
+
|
|
1050
|
+
if (row && row._selected_cells && row._selected_cells[this[0][0].column]) {
|
|
1051
|
+
return true;
|
|
1052
|
+
}
|
|
1053
|
+
}
|
|
1054
|
+
|
|
1055
|
+
return false;
|
|
1056
|
+
} );
|
|
1057
|
+
|
|
1058
|
+
|
|
1059
|
+
apiRegisterPlural( 'rows().deselect()', 'row().deselect()', function () {
|
|
1060
|
+
var api = this;
|
|
1061
|
+
|
|
1062
|
+
this.iterator( 'row', function ( ctx, idx ) {
|
|
1063
|
+
ctx.aoData[ idx ]._select_selected = false;
|
|
1064
|
+
ctx._select_lastCell = null;
|
|
1065
|
+
$( ctx.aoData[ idx ].nTr ).removeClass( ctx._select.className );
|
|
1066
|
+
} );
|
|
1067
|
+
|
|
1068
|
+
this.iterator( 'table', function ( ctx, i ) {
|
|
1069
|
+
eventTrigger( api, 'deselect', [ 'row', api[i] ], true );
|
|
1070
|
+
} );
|
|
1071
|
+
|
|
1072
|
+
return this;
|
|
1073
|
+
} );
|
|
1074
|
+
|
|
1075
|
+
apiRegisterPlural( 'columns().deselect()', 'column().deselect()', function () {
|
|
1076
|
+
var api = this;
|
|
1077
|
+
|
|
1078
|
+
this.iterator( 'column', function ( ctx, idx ) {
|
|
1079
|
+
ctx.aoColumns[ idx ]._select_selected = false;
|
|
1080
|
+
|
|
1081
|
+
var api = new DataTable.Api( ctx );
|
|
1082
|
+
var column = api.column( idx );
|
|
1083
|
+
|
|
1084
|
+
$( column.header() ).removeClass( ctx._select.className );
|
|
1085
|
+
$( column.footer() ).removeClass( ctx._select.className );
|
|
1086
|
+
|
|
1087
|
+
// Need to loop over each cell, rather than just using
|
|
1088
|
+
// `column().nodes()` as cells which are individually selected should
|
|
1089
|
+
// not have the `selected` class removed from them
|
|
1090
|
+
api.cells( null, idx ).indexes().each( function (cellIdx) {
|
|
1091
|
+
var data = ctx.aoData[ cellIdx.row ];
|
|
1092
|
+
var cellSelected = data._selected_cells;
|
|
1093
|
+
|
|
1094
|
+
if ( data.anCells && (! cellSelected || ! cellSelected[ cellIdx.column ]) ) {
|
|
1095
|
+
$( data.anCells[ cellIdx.column ] ).removeClass( ctx._select.className );
|
|
1096
|
+
}
|
|
1097
|
+
} );
|
|
1098
|
+
} );
|
|
1099
|
+
|
|
1100
|
+
this.iterator( 'table', function ( ctx, i ) {
|
|
1101
|
+
eventTrigger( api, 'deselect', [ 'column', api[i] ], true );
|
|
1102
|
+
} );
|
|
1103
|
+
|
|
1104
|
+
return this;
|
|
1105
|
+
} );
|
|
1106
|
+
|
|
1107
|
+
apiRegisterPlural( 'cells().deselect()', 'cell().deselect()', function () {
|
|
1108
|
+
var api = this;
|
|
1109
|
+
|
|
1110
|
+
this.iterator( 'cell', function ( ctx, rowIdx, colIdx ) {
|
|
1111
|
+
var data = ctx.aoData[ rowIdx ];
|
|
1112
|
+
|
|
1113
|
+
if(data._selected_cells !== undefined) {
|
|
1114
|
+
data._selected_cells[ colIdx ] = false;
|
|
1115
|
+
}
|
|
1116
|
+
|
|
1117
|
+
// Remove class only if the cells exist, and the cell is not column
|
|
1118
|
+
// selected, in which case the class should remain (since it is selected
|
|
1119
|
+
// in the column)
|
|
1120
|
+
if ( data.anCells && ! ctx.aoColumns[ colIdx ]._select_selected ) {
|
|
1121
|
+
$( data.anCells[ colIdx ] ).removeClass( ctx._select.className );
|
|
1122
|
+
}
|
|
1123
|
+
} );
|
|
1124
|
+
|
|
1125
|
+
this.iterator( 'table', function ( ctx, i ) {
|
|
1126
|
+
eventTrigger( api, 'deselect', [ 'cell', api[i] ], true );
|
|
1127
|
+
} );
|
|
1128
|
+
|
|
1129
|
+
return this;
|
|
1130
|
+
} );
|
|
1131
|
+
|
|
1132
|
+
|
|
1133
|
+
|
|
1134
|
+
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
|
1135
|
+
* Buttons
|
|
1136
|
+
*/
|
|
1137
|
+
function i18n( label, def ) {
|
|
1138
|
+
return function (dt) {
|
|
1139
|
+
return dt.i18n( 'buttons.'+label, def );
|
|
1140
|
+
};
|
|
1141
|
+
}
|
|
1142
|
+
|
|
1143
|
+
// Common events with suitable namespaces
|
|
1144
|
+
function namespacedEvents ( config ) {
|
|
1145
|
+
var unique = config._eventNamespace;
|
|
1146
|
+
|
|
1147
|
+
return 'draw.dt.DT'+unique+' select.dt.DT'+unique+' deselect.dt.DT'+unique;
|
|
1148
|
+
}
|
|
1149
|
+
|
|
1150
|
+
function enabled ( dt, config ) {
|
|
1151
|
+
if ( $.inArray( 'rows', config.limitTo ) !== -1 && dt.rows( { selected: true } ).any() ) {
|
|
1152
|
+
return true;
|
|
1153
|
+
}
|
|
1154
|
+
|
|
1155
|
+
if ( $.inArray( 'columns', config.limitTo ) !== -1 && dt.columns( { selected: true } ).any() ) {
|
|
1156
|
+
return true;
|
|
1157
|
+
}
|
|
1158
|
+
|
|
1159
|
+
if ( $.inArray( 'cells', config.limitTo ) !== -1 && dt.cells( { selected: true } ).any() ) {
|
|
1160
|
+
return true;
|
|
1161
|
+
}
|
|
1162
|
+
|
|
1163
|
+
return false;
|
|
1164
|
+
}
|
|
1165
|
+
|
|
1166
|
+
var _buttonNamespace = 0;
|
|
1167
|
+
|
|
1168
|
+
$.extend( DataTable.ext.buttons, {
|
|
1169
|
+
selected: {
|
|
1170
|
+
text: i18n( 'selected', 'Selected' ),
|
|
1171
|
+
className: 'buttons-selected',
|
|
1172
|
+
limitTo: [ 'rows', 'columns', 'cells' ],
|
|
1173
|
+
init: function ( dt, node, config ) {
|
|
1174
|
+
var that = this;
|
|
1175
|
+
config._eventNamespace = '.select'+(_buttonNamespace++);
|
|
1176
|
+
|
|
1177
|
+
// .DT namespace listeners are removed by DataTables automatically
|
|
1178
|
+
// on table destroy
|
|
1179
|
+
dt.on( namespacedEvents(config), function () {
|
|
1180
|
+
that.enable( enabled(dt, config) );
|
|
1181
|
+
} );
|
|
1182
|
+
|
|
1183
|
+
this.disable();
|
|
1184
|
+
},
|
|
1185
|
+
destroy: function ( dt, node, config ) {
|
|
1186
|
+
dt.off( config._eventNamespace );
|
|
1187
|
+
}
|
|
1188
|
+
},
|
|
1189
|
+
selectedSingle: {
|
|
1190
|
+
text: i18n( 'selectedSingle', 'Selected single' ),
|
|
1191
|
+
className: 'buttons-selected-single',
|
|
1192
|
+
init: function ( dt, node, config ) {
|
|
1193
|
+
var that = this;
|
|
1194
|
+
config._eventNamespace = '.select'+(_buttonNamespace++);
|
|
1195
|
+
|
|
1196
|
+
dt.on( namespacedEvents(config), function () {
|
|
1197
|
+
var count = dt.rows( { selected: true } ).flatten().length +
|
|
1198
|
+
dt.columns( { selected: true } ).flatten().length +
|
|
1199
|
+
dt.cells( { selected: true } ).flatten().length;
|
|
1200
|
+
|
|
1201
|
+
that.enable( count === 1 );
|
|
1202
|
+
} );
|
|
1203
|
+
|
|
1204
|
+
this.disable();
|
|
1205
|
+
},
|
|
1206
|
+
destroy: function ( dt, node, config ) {
|
|
1207
|
+
dt.off( config._eventNamespace );
|
|
1208
|
+
}
|
|
1209
|
+
},
|
|
1210
|
+
selectAll: {
|
|
1211
|
+
text: i18n( 'selectAll', 'Select all' ),
|
|
1212
|
+
className: 'buttons-select-all',
|
|
1213
|
+
action: function () {
|
|
1214
|
+
var items = this.select.items();
|
|
1215
|
+
this[ items+'s' ]().select();
|
|
1216
|
+
}
|
|
1217
|
+
},
|
|
1218
|
+
selectNone: {
|
|
1219
|
+
text: i18n( 'selectNone', 'Deselect all' ),
|
|
1220
|
+
className: 'buttons-select-none',
|
|
1221
|
+
action: function () {
|
|
1222
|
+
clear( this.settings()[0], true );
|
|
1223
|
+
},
|
|
1224
|
+
init: function ( dt, node, config ) {
|
|
1225
|
+
var that = this;
|
|
1226
|
+
config._eventNamespace = '.select'+(_buttonNamespace++);
|
|
1227
|
+
|
|
1228
|
+
dt.on( namespacedEvents(config), function () {
|
|
1229
|
+
var count = dt.rows( { selected: true } ).flatten().length +
|
|
1230
|
+
dt.columns( { selected: true } ).flatten().length +
|
|
1231
|
+
dt.cells( { selected: true } ).flatten().length;
|
|
1232
|
+
|
|
1233
|
+
that.enable( count > 0 );
|
|
1234
|
+
} );
|
|
1235
|
+
|
|
1236
|
+
this.disable();
|
|
1237
|
+
},
|
|
1238
|
+
destroy: function ( dt, node, config ) {
|
|
1239
|
+
dt.off( config._eventNamespace );
|
|
1240
|
+
}
|
|
1241
|
+
}
|
|
1242
|
+
} );
|
|
1243
|
+
|
|
1244
|
+
$.each( [ 'Row', 'Column', 'Cell' ], function ( i, item ) {
|
|
1245
|
+
var lc = item.toLowerCase();
|
|
1246
|
+
|
|
1247
|
+
DataTable.ext.buttons[ 'select'+item+'s' ] = {
|
|
1248
|
+
text: i18n( 'select'+item+'s', 'Select '+lc+'s' ),
|
|
1249
|
+
className: 'buttons-select-'+lc+'s',
|
|
1250
|
+
action: function () {
|
|
1251
|
+
this.select.items( lc );
|
|
1252
|
+
},
|
|
1253
|
+
init: function ( dt ) {
|
|
1254
|
+
var that = this;
|
|
1255
|
+
|
|
1256
|
+
dt.on( 'selectItems.dt.DT', function ( e, ctx, items ) {
|
|
1257
|
+
that.active( items === lc );
|
|
1258
|
+
} );
|
|
1259
|
+
}
|
|
1260
|
+
};
|
|
1261
|
+
} );
|
|
1262
|
+
|
|
1263
|
+
|
|
1264
|
+
|
|
1265
|
+
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
|
1266
|
+
* Initialisation
|
|
1267
|
+
*/
|
|
1268
|
+
|
|
1269
|
+
// DataTables creation - check if select has been defined in the options. Note
|
|
1270
|
+
// this required that the table be in the document! If it isn't then something
|
|
1271
|
+
// needs to trigger this method unfortunately. The next major release of
|
|
1272
|
+
// DataTables will rework the events and address this.
|
|
1273
|
+
$(document).on( 'preInit.dt.dtSelect', function (e, ctx) {
|
|
1274
|
+
if ( e.namespace !== 'dt' ) {
|
|
1275
|
+
return;
|
|
1276
|
+
}
|
|
1277
|
+
|
|
1278
|
+
DataTable.select.init( new DataTable.Api( ctx ) );
|
|
1279
|
+
} );
|
|
1280
|
+
|
|
1281
|
+
|
|
1282
|
+
export default DataTable;
|