https://survivalinternational.org/assets/controllers/admin/localized_outline_list_item_controller-233ae818.js

1import { Controller } from "@hotwired/stimulus"
2
3// Connects to data-controller="admin--localized-outline-list-item"
4export default class extends Controller {
5  static targets =
6    [
7      'localizedOutlineListItemTypes',
8      'localizedOutlineListItemSelect',
9      'localizedOutlineListItemManual',
10      'submitBtn'
11    ]
12
13  itemSelected () {
14    this.localizedOutlineListItemManualTarget.value="";
15    this.submitBtnTarget.disabled = false;
16  }
17
18  itemInputted () {
19    this.localizedOutlineListItemSelectTarget.value="";
20    this.submitBtnTarget.disabled = false;
21  }
22
23  retrieveItems () {
24    const type = this.localizedOutlineListItemTypesTarget.value;
25    const retrieveItemsPath = this.localizedOutlineListItemTypesTarget.dataset.fetchItemsPath;
26    if (type === "") { return }
27  
28    const csrfToken = document.head.querySelector("meta[name=csrf-token]")?.content;
29    const body = { localized_outline_list_item: { locale: this.localizedOutlineListItemTypesTarget.dataset.locale, item_type: type }}
30    fetch(retrieveItemsPath, {
31      headers: {
32        "X-CSRF-Token": csrfToken,
33        "Content-Type": "application/json"
34      },
35      method: 'POST',
36      body: JSON.stringify(body),
37    })
38    .then(response => response.json())
39    .then(data => this.populateSelectField(data.items));
40  }
41  
42  populateSelectField (items) {
43    if (items.length === 0) { return }
44    const elem = this.localizedOutlineListItemSelectTarget;
45    let newOptions = '<option value="">Please select a page</option>';
46    items.forEach((item) => { newOptions += `<option value="${item[1]}">${item[0]}</option>`; })
47    elem.innerHTML = newOptions;
48  }
49}