Move check all js into separate file
This commit is contained in:
parent
443daab128
commit
5ad645c225
|
@ -0,0 +1,24 @@
|
||||||
|
// Toggle all checkboxes.
|
||||||
|
window.onload = function() {
|
||||||
|
document
|
||||||
|
.querySelectorAll('[data-action="toggle-all"]')
|
||||||
|
.forEach(input => {
|
||||||
|
input.addEventListener('change', toggleAllCheckboxes);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Toggle all descendant checkboxes of a target.
|
||||||
|
*
|
||||||
|
* Use `data-target="ID_OF_TARGET"` on the node being listened to.
|
||||||
|
*
|
||||||
|
* @param {Event} event - change Event
|
||||||
|
* @return {undefined}
|
||||||
|
*/
|
||||||
|
function toggleAllCheckboxes(event) {
|
||||||
|
const mainCheckbox = event.target;
|
||||||
|
|
||||||
|
document
|
||||||
|
.querySelectorAll(`#${mainCheckbox.dataset.target} [type="checkbox"]`)
|
||||||
|
.forEach(checkbox => {checkbox.checked = mainCheckbox.checked;});
|
||||||
|
}
|
|
@ -8,13 +8,6 @@ window.onload = function() {
|
||||||
Array.from(document.getElementsByClassName('interaction'))
|
Array.from(document.getElementsByClassName('interaction'))
|
||||||
.forEach(t => t.onsubmit = interact);
|
.forEach(t => t.onsubmit = interact);
|
||||||
|
|
||||||
// Toggle all checkboxes.
|
|
||||||
document
|
|
||||||
.querySelectorAll('[data-action="toggle-all"]')
|
|
||||||
.forEach(input => {
|
|
||||||
input.addEventListener('change', toggleAllCheckboxes);
|
|
||||||
});
|
|
||||||
|
|
||||||
// handle aria settings on menus
|
// handle aria settings on menus
|
||||||
Array.from(document.getElementsByClassName('pulldown-menu'))
|
Array.from(document.getElementsByClassName('pulldown-menu'))
|
||||||
.forEach(t => t.onclick = toggleMenu);
|
.forEach(t => t.onclick = toggleMenu);
|
||||||
|
@ -109,22 +102,6 @@ function interact(e) {
|
||||||
.forEach(t => addRemoveClass(t, 'hidden', t.className.indexOf('hidden') == -1));
|
.forEach(t => addRemoveClass(t, 'hidden', t.className.indexOf('hidden') == -1));
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Toggle all descendant checkboxes of a target.
|
|
||||||
*
|
|
||||||
* Use `data-target="ID_OF_TARGET"` on the node being listened to.
|
|
||||||
*
|
|
||||||
* @param {Event} event - change Event
|
|
||||||
* @return {undefined}
|
|
||||||
*/
|
|
||||||
function toggleAllCheckboxes(event) {
|
|
||||||
const mainCheckbox = event.target;
|
|
||||||
|
|
||||||
document
|
|
||||||
.querySelectorAll(`#${mainCheckbox.dataset.target} [type="checkbox"]`)
|
|
||||||
.forEach(checkbox => {checkbox.checked = mainCheckbox.checked;});
|
|
||||||
}
|
|
||||||
|
|
||||||
function toggleMenu(e) {
|
function toggleMenu(e) {
|
||||||
var el = e.currentTarget;
|
var el = e.currentTarget;
|
||||||
var expanded = el.getAttribute('aria-expanded') == 'false';
|
var expanded = el.getAttribute('aria-expanded') == 'false';
|
||||||
|
|
|
@ -148,3 +148,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endspaceless %}{% endblock %}
|
{% endspaceless %}{% endblock %}
|
||||||
|
|
||||||
|
{% block scripts %}
|
||||||
|
<script src="/static/js/check_all.js"></script>
|
||||||
|
{% endblock %}
|
||||||
|
|
Loading…
Reference in New Issue