Files
openfoodnetwork/app/webpacker/controllers/toggle_control_controller.js
David Cook 69f160ff95 Toggle input disabled when on demand checked
This introduces a new 'toggle' controller, and we already had three\! So I created a generic interface that could be extended to potentially support all of them. I propose we try to reduce them all into the one controller, but won't go down the rabbit-hole just yet..

I have an idea on how to re-arrange and make it more contained, by assigning the controller only to the checkbox, and defining targets with aria-controls="", but chose to stick with Stimulus conventions for now.
2023-11-28 10:44:34 +11:00

34 lines
911 B
JavaScript

import { Controller } from "stimulus";
export default class extends Controller {
static targets = ["control"];
disableIfPresent(event) {
const input = event.currentTarget;
const disable = !!this.#inputValue(input); // Coerce value to boolean
this.controlTargets.forEach((target) => {
target.disabled = disable;
});
// Focus when enabled
if (!disable) {
this.controlTargets[0].focus();
}
}
//todo: can a new method disableIfBlank replace ButtonDisabledController?
//todo: can a new method toggleDisplay replace ToggleController?
//todo: can toggleDisplay with optional chevron-target replace RemoteToggleController?
// private
// Return input's value, but only if it would be submitted by a form
// Radio buttons not supported (yet)
#inputValue(input) {
if (input.type != "checkbox" || input.checked) {
return input.value;
}
}
}