You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.6 KiB
JavaScript
47 lines
1.6 KiB
JavaScript
import $ from 'jquery';
|
|
import { AutoloadPage } from 'vj/misc/Page';
|
|
|
|
const lastSelectionByGroup = {};
|
|
|
|
function isInGroup(group) {
|
|
return (idx, element) => element.getAttribute('data-checkbox-group') === group;
|
|
}
|
|
|
|
function onRangeRoleCheckboxClick(ev) {
|
|
const $current = $(ev.currentTarget);
|
|
const targetGroup = $current.attr('data-checkbox-group');
|
|
const $targets = $('[type="checkbox"]')
|
|
.filter(isInGroup(targetGroup))
|
|
.filter(':visible')
|
|
.filter(':not(:disabled)');
|
|
if (ev.shiftKey && lastSelectionByGroup[targetGroup]) {
|
|
const destCheck = lastSelectionByGroup[targetGroup].prop('checked');
|
|
const from = $targets.index(lastSelectionByGroup[targetGroup]);
|
|
const to = $targets.index($current);
|
|
const start = Math.min(from, to);
|
|
const end = Math.max(from, to) + 1;
|
|
$targets
|
|
.slice(start, end)
|
|
.prop('checked', destCheck);
|
|
}
|
|
lastSelectionByGroup[targetGroup] = $current;
|
|
}
|
|
|
|
function onToggleRoleCheckboxClick(ev) {
|
|
const $current = $(ev.currentTarget);
|
|
const targetGroup = $current.attr('data-checkbox-toggle');
|
|
const $targets = $('[type="checkbox"]')
|
|
.filter(isInGroup(targetGroup))
|
|
.filter(':visible')
|
|
.filter(':not(:disabled)');
|
|
const destCheck = $current.prop('checked');
|
|
$targets.prop('checked', destCheck);
|
|
}
|
|
|
|
const multiSelectCheckboxPage = new AutoloadPage('multiSelectCheckboxPage', () => {
|
|
$(document).on('click', '[data-checkbox-range]', onRangeRoleCheckboxClick);
|
|
$(document).on('click', '[data-checkbox-toggle]', onToggleRoleCheckboxClick);
|
|
});
|
|
|
|
export default multiSelectCheckboxPage;
|