Test "Meilleur validation des adresses lors de la demande de contreparties"

Objectif

Ajouter une fonctionnalité d’autocomplétion sur le champ adresse1 du profil utilisateur, accessible à cette URL : http://127.0.0.1:8000/fr/user/address. L’autocomplétion doit proposer des adresses en fonction de la saisie de l’utilisateur.

Services utilisés

  • FOSJsRoutingBundle (lien GitHub) : pour appeler une route Symfony depuis un fichier JavaScript.
  • API Géoplateforme (lien officiel) : pour récupérer les suggestions d’adresses.

Mise en place

1. Installation de FOSJsRoutingBundle

Exécuter la commande suivante pour installer le bundle :

composer require friendsofsymfony/jsrouting-bundle

Ce bundle permet d’appeler une route Symfony directement depuis un fichier JavaScript, via Routing.generate('api_geopf_autocomplete').


2. Création du service GeoPFApiService

Ajout du service src/Service/API/GeoPFApiService.php, qui gère les appels à l’API Géoplateforme.

Fonctionnement :

  • La méthode getAddressSuggestions effectue un appel API à l’URL suivante :

    $this->httpClient->request('GET', 'https://data.geopf.fr/geocodage/search');

  • Les résultats sont formatés sous forme de tableau associatif :

    $results[] = [ 'id' => $feature['properties']['id'], 'text' => $feature['properties']['label'], 'adresse' => $feature['properties']['name'], 'cp' => $feature['properties']['postcode'], 'ville' => $feature['properties']['city'], ];


3. Création du contrôleur GeoPFApiController

Ajout du contrôleur src/Controller/Api/GeoPFApiController.php, qui fait le lien entre le service et la requête AJAX effectuée dans le JS.

Fonctionnement :

  • Le contrôleur est appelé via jQuery, grâce à un appel AJAX.
  • Il récupère la saisie de l’utilisateur et la transmet au service GeoPFApiService pour obtenir les suggestions d’adresses.

4. Intégration JavaScript

Un fichier JavaScript gère l’événement sur le champ adresse1 :

  • Écoute de la saisie : affiche les résultats au fur et à mesure. Temporisation de 10 caractère afin de ne pas faire un call sur "[NUMERO DE RUE] rue"
  • Sélection d’une adresse : remplit automatiquement les champs adresse1, cp et city lors du clic sur une suggestion.

Rapports de requête de fusion

Chargement en cours