31 lines
1.1 KiB
JavaScript
31 lines
1.1 KiB
JavaScript
// SPDX-FileCopyrightText: 2024 Simon Bruder <simon@sbruder.de>
|
|
//
|
|
// SPDX-License-Identifier: AGPL-3.0-or-later
|
|
|
|
(() => {
|
|
// Allows a form checkbox to toggle an input element.
|
|
// This requires the form to have a structure like described in the bootstrap documentation:
|
|
// https://getbootstrap.com/docs/5.3/forms/input-group/#checkboxes-and-radios
|
|
const inputToggle = target => {
|
|
target.parentElement.parentElement.querySelector("input:not(.input-toggle)").disabled = !target.checked
|
|
}
|
|
Array.from(document.getElementsByClassName("input-toggle")).forEach(el => {
|
|
inputToggle(el)
|
|
el.addEventListener("change", e => inputToggle(e.target))
|
|
})
|
|
|
|
const datalistHint = (input, hint) => {
|
|
const selected = input.list.querySelector(`option[value="${input.value}"]`);
|
|
if (selected === null)
|
|
hint.innerText = ""
|
|
else {
|
|
hint.innerHTML = selected.innerHTML
|
|
}
|
|
}
|
|
Array.from(document.getElementsByClassName("datalist-hint")).forEach(hint => {
|
|
const input = hint.parentElement.querySelector("input[list]")
|
|
datalistHint(input, hint)
|
|
input.addEventListener("input", _ => datalistHint(input, hint))
|
|
})
|
|
})()
|