|
0
|
1 /*
|
|
|
2 * tablesaw: A set of plugins for responsive tables
|
|
|
3 * Check all Checkbox: checkbox in header cell selects all checkboxes in the same table column.
|
|
|
4 * Copyright (c) 2013 Filament Group, Inc.
|
|
|
5 * MIT License
|
|
|
6 */
|
|
|
7
|
|
|
8 (function() {
|
|
|
9 var pluginName = "tablesawCheckAll";
|
|
|
10
|
|
|
11 function CheckAll(tablesaw) {
|
|
|
12 this.tablesaw = tablesaw;
|
|
|
13 this.$table = tablesaw.$table;
|
|
|
14
|
|
|
15 this.attr = "data-tablesaw-checkall";
|
|
|
16 this.checkAllSelector = "[" + this.attr + "]";
|
|
|
17 this.forceCheckedSelector = "[" + this.attr + "-checked]";
|
|
|
18 this.forceUncheckedSelector = "[" + this.attr + "-unchecked]";
|
|
|
19 this.checkboxSelector = 'input[type="checkbox"]';
|
|
|
20
|
|
|
21 this.$triggers = null;
|
|
|
22 this.$checkboxes = null;
|
|
|
23
|
|
|
24 if (this.$table.data(pluginName)) {
|
|
|
25 return;
|
|
|
26 }
|
|
|
27 this.$table.data(pluginName, this);
|
|
|
28 this.init();
|
|
|
29 }
|
|
|
30
|
|
|
31 CheckAll.prototype._filterCells = function($checkboxes) {
|
|
|
32 return $checkboxes
|
|
|
33 .filter(function() {
|
|
|
34 return !$(this)
|
|
|
35 .closest("tr")
|
|
|
36 .is("[data-tablesaw-subrow],[data-tablesaw-ignorerow]");
|
|
|
37 })
|
|
|
38 .find(this.checkboxSelector)
|
|
|
39 .not(this.checkAllSelector);
|
|
|
40 };
|
|
|
41
|
|
|
42 // With buttons you can use a scoping selector like: data-tablesaw-checkall="#my-scoped-id input[type='checkbox']"
|
|
|
43 CheckAll.prototype.getCheckboxesForButton = function(button) {
|
|
|
44 return this._filterCells($($(button).attr(this.attr)));
|
|
|
45 };
|
|
|
46
|
|
|
47 CheckAll.prototype.getCheckboxesForCheckbox = function(checkbox) {
|
|
|
48 return this._filterCells($($(checkbox).closest("th")[0].cells));
|
|
|
49 };
|
|
|
50
|
|
|
51 CheckAll.prototype.init = function() {
|
|
|
52 var self = this;
|
|
|
53 this.$table.find(this.checkAllSelector).each(function() {
|
|
|
54 var $trigger = $(this);
|
|
|
55 if ($trigger.is(self.checkboxSelector)) {
|
|
|
56 self.addCheckboxEvents(this);
|
|
|
57 } else {
|
|
|
58 self.addButtonEvents(this);
|
|
|
59 }
|
|
|
60 });
|
|
|
61 };
|
|
|
62
|
|
|
63 CheckAll.prototype.addButtonEvents = function(trigger) {
|
|
|
64 var self = this;
|
|
|
65
|
|
|
66 // Update body checkboxes when header checkbox is changed
|
|
|
67 $(trigger).on("click", function(event) {
|
|
|
68 event.preventDefault();
|
|
|
69
|
|
|
70 var $checkboxes = self.getCheckboxesForButton(this);
|
|
|
71
|
|
|
72 var allChecked = true;
|
|
|
73 $checkboxes.each(function() {
|
|
|
74 if (!this.checked) {
|
|
|
75 allChecked = false;
|
|
|
76 }
|
|
|
77 });
|
|
|
78
|
|
|
79 var setChecked;
|
|
|
80 if ($(this).is(self.forceCheckedSelector)) {
|
|
|
81 setChecked = true;
|
|
|
82 } else if ($(this).is(self.forceUncheckedSelector)) {
|
|
|
83 setChecked = false;
|
|
|
84 } else {
|
|
|
85 setChecked = allChecked ? false : true;
|
|
|
86 }
|
|
|
87
|
|
|
88 $checkboxes.each(function() {
|
|
|
89 this.checked = setChecked;
|
|
|
90
|
|
|
91 $(this).trigger("change." + pluginName);
|
|
|
92 });
|
|
|
93 });
|
|
|
94 };
|
|
|
95
|
|
|
96 CheckAll.prototype.addCheckboxEvents = function(trigger) {
|
|
|
97 var self = this;
|
|
|
98
|
|
|
99 // Update body checkboxes when header checkbox is changed
|
|
|
100 $(trigger).on("change", function() {
|
|
|
101 var setChecked = this.checked;
|
|
|
102
|
|
|
103 self.getCheckboxesForCheckbox(this).each(function() {
|
|
|
104 this.checked = setChecked;
|
|
|
105 });
|
|
|
106 });
|
|
|
107
|
|
|
108 var $checkboxes = self.getCheckboxesForCheckbox(trigger);
|
|
|
109
|
|
|
110 // Update header checkbox when body checkboxes are changed
|
|
|
111 $checkboxes.on("change." + pluginName, function() {
|
|
|
112 var checkedCount = 0;
|
|
|
113 $checkboxes.each(function() {
|
|
|
114 if (this.checked) {
|
|
|
115 checkedCount++;
|
|
|
116 }
|
|
|
117 });
|
|
|
118
|
|
|
119 var allSelected = checkedCount === $checkboxes.length;
|
|
|
120
|
|
|
121 trigger.checked = allSelected;
|
|
|
122
|
|
|
123 // only indeterminate if some are selected (not all and not none)
|
|
|
124 trigger.indeterminate = checkedCount !== 0 && !allSelected;
|
|
|
125 });
|
|
|
126 };
|
|
|
127
|
|
|
128 // on tablecreate, init
|
|
|
129 $(document).on(Tablesaw.events.create, function(e, tablesaw) {
|
|
|
130 new CheckAll(tablesaw);
|
|
|
131 });
|
|
|
132
|
|
|
133 Tablesaw.CheckAll = CheckAll;
|
|
|
134 })();
|
