JS : Toggle a range of checkboxes using the shift-key

check-multiple-inputs.js

(function () {
    const table = document.getElementById('my-table');
    let lastInput = null;

    table.addEventListener('click', function (event) {
        const currInput = event.target;

        if (currInput.type !== 'checkbox') {
            return;
        }

        if (event.shiftKey && lastInput !== null && lastInput !== currInput) {
            const inputs = table.querySelectorAll('input[type="checkbox"]');

            lastInput.checked = currInput.checked;
            lastInput.dispatchEvent(new Event('change', {
                bubbles: true,
                cancelable: true
            }));

            let inBetween = false;
            inputs.forEach(function (input) {
                if (input === lastInput || input === currInput) {
                    inBetween = !inBetween;
                } else if (inBetween) {
                    input.checked = currInput.checked;
                    input.dispatchEvent(new Event('change', {
                        bubbles: true,
                        cancelable: true
                    }));
                }
            });
        }

        lastInput = currInput;
    }, {
        passive: true
    });
})();