Version 1.2.15: Autovervollständigung für Orte
This commit is contained in:
@@ -107,6 +107,8 @@
|
||||
<script>
|
||||
let searchTimeout;
|
||||
let lastResults = [];
|
||||
let fachrichtungTimeout;
|
||||
let ortTimeout;
|
||||
|
||||
function createPhoneLink(phone) {
|
||||
if (!phone) return '';
|
||||
@@ -407,6 +409,103 @@
|
||||
searchCustomers();
|
||||
}
|
||||
});
|
||||
|
||||
function setupFachrichtungAutocomplete() {
|
||||
const fachrichtungInput = document.getElementById('fachrichtungInput');
|
||||
const autocompleteList = document.createElement('div');
|
||||
autocompleteList.className = 'autocomplete-items';
|
||||
fachrichtungInput.parentNode.appendChild(autocompleteList);
|
||||
|
||||
fachrichtungInput.addEventListener('input', function() {
|
||||
clearTimeout(fachrichtungTimeout);
|
||||
const searchTerm = this.value;
|
||||
|
||||
if (searchTerm.length < 2) {
|
||||
autocompleteList.style.display = 'none';
|
||||
return;
|
||||
}
|
||||
|
||||
fachrichtungTimeout = setTimeout(() => {
|
||||
fetch(`/api/fachrichtungen?q=${encodeURIComponent(searchTerm)}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
autocompleteList.innerHTML = '';
|
||||
if (data.length > 0) {
|
||||
data.forEach(item => {
|
||||
const div = document.createElement('div');
|
||||
div.textContent = item;
|
||||
div.addEventListener('click', () => {
|
||||
fachrichtungInput.value = item;
|
||||
autocompleteList.style.display = 'none';
|
||||
searchCustomers();
|
||||
});
|
||||
autocompleteList.appendChild(div);
|
||||
});
|
||||
autocompleteList.style.display = 'block';
|
||||
} else {
|
||||
autocompleteList.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}, 300);
|
||||
});
|
||||
|
||||
document.addEventListener('click', function(e) {
|
||||
if (!fachrichtungInput.contains(e.target) && !autocompleteList.contains(e.target)) {
|
||||
autocompleteList.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setupOrtAutocomplete() {
|
||||
const ortInput = document.getElementById('ortInput');
|
||||
const autocompleteList = document.createElement('div');
|
||||
autocompleteList.className = 'autocomplete-items';
|
||||
ortInput.parentNode.appendChild(autocompleteList);
|
||||
|
||||
ortInput.addEventListener('input', function() {
|
||||
clearTimeout(ortTimeout);
|
||||
const searchTerm = this.value;
|
||||
|
||||
if (searchTerm.length < 2) {
|
||||
autocompleteList.style.display = 'none';
|
||||
return;
|
||||
}
|
||||
|
||||
ortTimeout = setTimeout(() => {
|
||||
fetch(`/api/orte?q=${encodeURIComponent(searchTerm)}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
autocompleteList.innerHTML = '';
|
||||
if (data.length > 0) {
|
||||
data.forEach(item => {
|
||||
const div = document.createElement('div');
|
||||
div.textContent = item;
|
||||
div.addEventListener('click', () => {
|
||||
ortInput.value = item;
|
||||
autocompleteList.style.display = 'none';
|
||||
searchCustomers();
|
||||
});
|
||||
autocompleteList.appendChild(div);
|
||||
});
|
||||
autocompleteList.style.display = 'block';
|
||||
} else {
|
||||
autocompleteList.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}, 300);
|
||||
});
|
||||
|
||||
document.addEventListener('click', function(e) {
|
||||
if (!ortInput.contains(e.target) && !autocompleteList.contains(e.target)) {
|
||||
autocompleteList.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
setupFachrichtungAutocomplete();
|
||||
setupOrtAutocomplete();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Reference in New Issue
Block a user