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.
xshop/resources/js/panel/list-checkboxs.js

142 lines
3.9 KiB
JavaScript

function clearSelection() {
if (window.getSelection) {
window.getSelection().removeAllRanges();
} else if (document.selection) {
document.selection.empty();
}
}
function serializeForm(selector) {
let form = document.querySelector(selector);
if (form == null) {
return [];
}
let formData = new FormData(form);
let serializedArray = [];
formData.forEach(function (value, key) {
serializedArray.push({
name: key,
value: value
});
});
return serializedArray;
}
function handleCheckChange() {
let frm = serializeForm('#main-form');
let bi = document.querySelector('#bulk-idz');
bi.innerHTML = '';
for (const item of frm) {
let n = document.createElement("input");
n.name = item.name;
n.value = item.value;
n.type = 'hidden';
bi.appendChild(n);
}
if (frm.length == 0) {
document.querySelector('#bulk-from').style.maxHeight = '0';
} else {
document.querySelector('#bulk-from').style.maxHeight = '250px';
}
}
window.addEventListener('load', function () {
let chkall = document.querySelectorAll(".chkall");
if (chkall.length == 0){
return false;
}
let toggle = document.querySelector('#toggle-select');
if (toggle != null) {
toggle?.addEventListener('click', function () {
let checkboxes = document.querySelectorAll(".chkbox");
checkboxes.forEach(function (checkbox) {
if (!checkbox.checked) {
checkbox.checked = true;
checkbox.setAttribute("checked", "");
} else {
checkbox.checked = false;
checkbox.removeAttribute("checked");
}
});
});
handleCheckChange();
}
// Attach an event listener for "change" and "click" events
chkall.forEach(function (chkall) {
chkall.addEventListener("change", handleCheckboxChange);
chkall.addEventListener("click", handleCheckboxChange);
});
function handleCheckboxChange() {
let isChecked = this.checked;
let table = this.closest("table");
if (isChecked) {
// Check all checkboxes in the table
let checkboxes = table.querySelectorAll(".chkbox");
checkboxes.forEach(function (checkbox) {
checkbox.checked = true;
checkbox.setAttribute("checked", "");
});
} else {
// Uncheck all checkboxes in the table
let checkboxes = table.querySelectorAll(".chkbox");
checkboxes.forEach(function (checkbox) {
checkbox.checked = false;
checkbox.removeAttribute("checked");
});
}
handleCheckChange();
}
// select with shift button
const chkboxes = document.querySelectorAll('.chkbox');
let lastChecked = null;
chkboxes.forEach(chkbox => {
chkbox.addEventListener('click', handleCheckboxClick);
chkbox.parentNode.querySelector('label').addEventListener('click', handleCheckboxClick);
chkbox.addEventListener('change', handleCheckChange);
});
function handleCheckboxClick(e) {
clearSelection();
let self = this;
if (e.target.tagName === 'LABEL') {
self = e.target.parentNode.querySelector('input');
}
if (!lastChecked) {
lastChecked = self;
return;
}
if (e.shiftKey) {
const start = Array.from(chkboxes).indexOf(self);
const end = Array.from(chkboxes).indexOf(lastChecked);
const range = Array.from(chkboxes).slice(Math.min(start, end) + 1, Math.max(start, end));
range.forEach(chkbox => {
chkbox.checked = lastChecked.checked;
});
}
handleCheckChange();
lastChecked = self;
}
handleCheckChange();
});