50 lines
2.5 KiB
JavaScript
50 lines
2.5 KiB
JavaScript
'use strict';
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
document.querySelectorAll('[data-koperasi-wilayah], #koperasi-filter-form').forEach(container => {
|
|
const levels = ['provinsi', 'kabupaten', 'kecamatan', 'desa']
|
|
.map(name => ({ name, input: container.querySelector(`[data-wilayah-${name}]`) }))
|
|
.filter(level => level.input);
|
|
const controllers = new Map();
|
|
const updateRequired = () => {
|
|
if (!container.matches('[data-koperasi-wilayah]')) return;
|
|
const hasSelection = levels.some(level => level.input.value);
|
|
levels.forEach(level => { level.input.required = hasSelection; });
|
|
};
|
|
const reset = level => {
|
|
controllers.get(level.name)?.abort();
|
|
level.input.replaceChildren(new Option(level.input.options[0].textContent, ''));
|
|
level.input.disabled = true;
|
|
};
|
|
levels.forEach((level, index) => {
|
|
if (index === levels.length - 1) return;
|
|
level.input.addEventListener('change', async () => {
|
|
levels.slice(index + 1).forEach(reset);
|
|
updateRequired();
|
|
if (!level.input.value) return;
|
|
const child = levels[index + 1];
|
|
const controller = new AbortController();
|
|
controllers.set(child.name, controller);
|
|
const url = new URL(container.dataset[`${child.name}Url`].replace(':id', encodeURIComponent(level.input.value)), window.location.href);
|
|
url.searchParams.set('all_wilayah', '1');
|
|
try {
|
|
const response = await fetch(url, {
|
|
signal: controller.signal,
|
|
headers: { 'Accept': 'application/json', 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.content || '' }
|
|
});
|
|
if (!response.ok) throw new Error('Wilayah gagal dimuat');
|
|
const options = await response.json();
|
|
if (controller.signal.aborted) return;
|
|
options.forEach(option => child.input.add(new Option(option.nama, option.id)));
|
|
child.input.disabled = false;
|
|
updateRequired();
|
|
} catch (error) {
|
|
if (error.name === 'AbortError') return;
|
|
child.input.add(new Option('Gagal memuat wilayah, pilih ulang wilayah induk', '', false, true));
|
|
}
|
|
});
|
|
});
|
|
updateRequired();
|
|
});
|
|
});
|