59 lines
1.9 KiB
JavaScript
59 lines
1.9 KiB
JavaScript
(() => {
|
|
function applyTypeFilter(typeSelect, portSelect, selectedId) {
|
|
const endpointType = typeSelect.value;
|
|
let visibleCount = 0;
|
|
let matchedSelected = false;
|
|
const currentValue = selectedId || portSelect.value || '';
|
|
|
|
for (const option of portSelect.options) {
|
|
const optionType = option.dataset.endpointType || '';
|
|
if (!optionType) {
|
|
option.hidden = false;
|
|
option.disabled = false;
|
|
continue;
|
|
}
|
|
|
|
const visible = optionType === endpointType;
|
|
option.hidden = !visible;
|
|
option.disabled = !visible;
|
|
|
|
if (visible) {
|
|
visibleCount += 1;
|
|
if (option.value === currentValue) {
|
|
option.selected = true;
|
|
matchedSelected = true;
|
|
}
|
|
} else if (option.selected) {
|
|
option.selected = false;
|
|
}
|
|
}
|
|
|
|
const placeholder = portSelect.options[0];
|
|
if (placeholder) {
|
|
placeholder.textContent = visibleCount > 0 ? '- Port waehlen -' : '- Keine Ports verfuegbar -';
|
|
}
|
|
|
|
if (!matchedSelected) {
|
|
portSelect.value = '';
|
|
}
|
|
}
|
|
|
|
function bindPair(typeSelectId, portSelectId) {
|
|
const typeSelect = document.getElementById(typeSelectId);
|
|
const portSelect = document.getElementById(portSelectId);
|
|
if (!typeSelect || !portSelect) {
|
|
return;
|
|
}
|
|
|
|
applyTypeFilter(typeSelect, portSelect, portSelect.dataset.selectedId || '');
|
|
typeSelect.addEventListener('change', () => {
|
|
applyTypeFilter(typeSelect, portSelect, '');
|
|
});
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
bindPair('port_a_type', 'port_a_id');
|
|
bindPair('port_b_type', 'port_b_id');
|
|
});
|
|
})();
|