1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
|
/** Handlers for events in datatables **/
var addTableLength = (menuList, lengthToAdd, dataLength) => {
if(dataLength >= lengthToAdd) {
newList = structuredClone(menuList);//menuList.slice(0, menuList.length); // shallow copy
newList.push(lengthToAdd);
return newList;
}
return menuList;
};
var defaultLengthMenu = (data) => {
menuList = []
var lengths = [10, 25, 50, 100, 1000];
if(data.length > 1000) {
lengths.push(data.length)
}
lengths.forEach((len) => {
menuList = addTableLength(menuList, len, data.length);
});
return menuList;
};
var setRowCheckableProperty = (node, state) => {
/**
* Set a row's (`node`) checkbox's or radio button's checked state to the
* boolean value `state`.
**/
if(typeof(state) == "boolean") {
var pseudoclass = state == false ? ":checked" : ":not(:checked)";
var checkable = (
$(node).find(`input[type="checkbox"]${pseudoclass}`)[0]
||
$(node).find(`input[type="radio"]${pseudoclass}`)[0]);
$(checkable).prop("checked", state);
} else {
throw new Error("`state` *MUST* be a boolean value.")
}
};
var setRowChecked = (node) => {setRowCheckableProperty(node, true);};
var setRowUnchecked = (node) => {setRowCheckableProperty(node, false);};
var buildDataTable = (tableId, data = [], columns = [], userSettings = {}) => {
var defaultSettings = {
responsive: true,
layout: {
topStart: null,
topEnd: null,
bottomStart: null,
bottomEnd: null,
},
select: true,
lengthMenu: defaultLengthMenu(data),
language: {
processing: "Processing… Please wait.",
loadingRecords: "Loading table data… Please wait.",
lengthMenu: "",
info: ""
},
drawCallback: function (settings) {
var api = this.api();
api.rows({selected: true}).nodes().each((node, index) => {
setRowChecked(node);
});
api.rows({selected: false}).nodes().each((node, index) => {
setRowUnchecked(node);
});
}
}
var theDataTable = $(tableId).DataTable({
...defaultSettings,
...userSettings,
...(data.length == 0 ? {} : {data: data}),
...(columns.length == 0 ? {} : {columns: columns})
});
theDataTable.on("select", (event, datatable, type, indexes) => {
datatable
.rows(indexes)
.nodes()
.each((node, index) => {
setRowChecked(node);
});
});
theDataTable.on("deselect", (event, datatable, type, indexes) => {
datatable
.rows(indexes)
.nodes()
.each(function(node, index) {
setRowUnchecked(node);
});
});
theDataTable.selectAll = () => {theDataTable.rows().select()};
theDataTable.deselectAll = () => {theDataTable.rows().deselect()};
return theDataTable;
};
|
