80 lines
3.8 KiB
JavaScript
80 lines
3.8 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
const villeSelect = document.getElementById('sortie_ville');
|
|
const lieuSelect = document.getElementById('sortie_lieu');
|
|
|
|
const rueLabel = document.getElementById('rue-value');
|
|
const codePostalLabel = document.getElementById('codePostal-value');
|
|
const latitudeLabel = document.getElementById('latitude-value');
|
|
const longitudeLabel = document.getElementById('longitude-value');
|
|
|
|
if (villeSelect && lieuSelect) {
|
|
// Désactiver le menu déroulant des lieux au départ
|
|
lieuSelect.disabled = true;
|
|
|
|
// Listener pour le changement de ville
|
|
villeSelect.addEventListener('change', function () {
|
|
const villeId = villeSelect.value;
|
|
|
|
// Réinitialisation des options de lieu
|
|
lieuSelect.innerHTML = '<option value="">Sélectionnez un lieu</option>';
|
|
lieuSelect.disabled = true; // Toujours désactiver avant de récupérer les données
|
|
|
|
if (villeId) {
|
|
fetch(`/get-lieux/${villeId}`)
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error('Erreur lors de la récupération des lieux');
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
// Ajouter les options si des lieux sont disponibles
|
|
if (data.length > 0) {
|
|
data.forEach(lieu => {
|
|
const option = document.createElement('option');
|
|
option.value = lieu.id; // Utiliser l'ID pour la soumission
|
|
option.textContent = lieu.nom; // Texte visible dans le menu
|
|
lieuSelect.appendChild(option);
|
|
});
|
|
lieuSelect.disabled = false; // Activer le menu des lieux
|
|
} else {
|
|
lieuSelect.innerHTML = '<option value="">Aucun lieu disponible</option>';
|
|
lieuSelect.disabled = true; // Toujours désactivé si aucun lieu n'est trouvé
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Erreur lors de la récupération des lieux :', error);
|
|
});
|
|
}
|
|
});
|
|
|
|
// Listener pour le changement de lieu
|
|
lieuSelect.addEventListener('change', function () {
|
|
const selectedOption = lieuSelect.options[lieuSelect.selectedIndex];
|
|
if (selectedOption) {
|
|
const lieuDetails = selectedOption.dataset.details
|
|
? JSON.parse(selectedOption.dataset.details)
|
|
: null;
|
|
|
|
// Mise à jour des labels avec les détails du lieu sélectionné
|
|
rueLabel.textContent = lieuDetails?.rue || 'Non renseignée';
|
|
codePostalLabel.textContent = lieuDetails?.codePostal || 'Non renseigné';
|
|
latitudeLabel.textContent = lieuDetails?.latitude || 'Non renseignée';
|
|
longitudeLabel.textContent = lieuDetails?.longitude || 'Non renseignée';
|
|
|
|
console.log('Lieu sélectionné:', lieuDetails);
|
|
} else {
|
|
// Réinitialiser les labels si aucun lieu n'est sélectionné
|
|
rueLabel.textContent = 'Renseigner avec le lieu';
|
|
codePostalLabel.textContent = 'Renseigner avec le lieu';
|
|
latitudeLabel.textContent = 'Renseigner avec le lieu';
|
|
longitudeLabel.textContent = 'Renseigner avec le lieu';
|
|
|
|
console.log('Aucun lieu sélectionné.');
|
|
}
|
|
});
|
|
} else {
|
|
console.error('Les champs ville-select ou lieu-select sont introuvables.');
|
|
}
|
|
});
|