Suite à la lecture d'un article de Robloche signalé par Aurélien, j'ai voulu tenter d'appliquer le principe de mise à jour de listes liées via un script serveur sans recharger la page à un cas pratique, la saisie normalisée d'une adresse...
AJAX : Asynchronous JavaScript with XmlHttpRequest
Avant tout
Comme expliqué dans le Tutorial sur les requêtes serveur en JavaScript de Robloche, on peut, et ça ouvre des horizons passionnants, exécuter un script serveur sans recharger la page suite à un évènement JavaScript grâce à XMLHTTPRequest ! Si, si... :) et ceci est compatible avec Internet Explorer et FireFox !!!
Je vous conseille donc, avant d'aller plus loin, de lire l'article de Robloche et notamment son exemple de 2 listes liées.
Ensuite nous allons voir comment étendre ce principe à plusieurs listes dans le cas pratique d'un formulaire de saisie d'adresse où nous éviterons au visiteur d'avoir à taper son code postal ainsi que sa ville ;) comme sur cette Démo.
Pour ce faire, nous aurons besoin d'une base de données des communes de France... Récupérons donc par exemple le fichier .csv de Jérôme GALICHON.
Il restera sans doute à optimiser les scripts qui suivent avant passage en production principalement en proposant une alternative si le JavaScript a été désactivé par le visiteur ou bien si son navigateur n'est pas compatible... mais bon, vous avez dû comprendre le principe général :)