mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-01-25 20:46:48 +00:00
151a6fd16b
1. Introduce a stimulus toggle_controller
- controller: { "data-controller": "toggle" }
- action: { "data-action": "toggle#toggle" }
- show or not: { "data-toggle-show": true || false }
- targets: { "data-toggle-target": "content", style: "display: none" }
Display payment method price
2. States are populated via a new dependant_select_controller by stimulus.
Usage:
- controller : { "data-controller": "dependant-select", "data-dependant-select-options-value": [ [1: ["option", "for", "1"], [2: ["option", "for", "2"] ] }
- target (on the populating target): { "data-dependant-select-target": "select" }
- source and action (on the input that leads the dependant select): {"data-dependant-select-target": "source", "data-action": "dependant-select#handleSelectChange"}
Some improvements on readability
3. Populate ShippingMethod description thanks to "shippingmethod_controller"
+
- Add countries and states
28 lines
739 B
JavaScript
28 lines
739 B
JavaScript
import { Controller } from "stimulus";
|
|
|
|
export default class extends Controller {
|
|
static targets = ["source", "select"];
|
|
static values = { options: Array };
|
|
|
|
connect() {
|
|
this.populateSelect(parseInt(this.sourceTarget.value));
|
|
}
|
|
|
|
handleSelectChange() {
|
|
this.populateSelect(parseInt(this.sourceTarget.value));
|
|
}
|
|
|
|
populateSelect(sourceId) {
|
|
const allOptions = this.optionsValue;
|
|
const options = allOptions.find((option) => option[0] === sourceId)[1];
|
|
const selectBox = this.selectTarget;
|
|
selectBox.innerHTML = "";
|
|
options.forEach((item) => {
|
|
const opt = document.createElement("option");
|
|
opt.value = item[1];
|
|
opt.innerHTML = item[0];
|
|
selectBox.appendChild(opt);
|
|
});
|
|
}
|
|
}
|