1. Accueil
  2. Tous les snippets
  3. Snippets Javascript
  4. Afficher les villes suivant le codepostal dans un dropdownlist

Afficher les villes suivant le codepostal dans un dropdownlist

Soyez le premier à donner votre avis sur cette source.

Snippet vu 16 644 fois - Téléchargée 29 fois

Commenter

Contenu du snippet

Cette source utilise un webservice qui permet de donner les villes en fonctions du code postal, ce code est pas entierement finalisé, il reste la gestion des erreurs.
Ce code ne marche pas sous firefox, j'ai testé que sous IE et ca marche.
Je vais implementer ce code pour faire un controle asp.net donc je ne pense pas que le coté javascript va évoluer, je pense gerer les differents navigateur via asp donc si vous avez une astuce pour faire fonctionner le code sous d'autre navigateurs n'hesitez pas

je remercie agerodol qui m'a montré comment faire fonctionner un webservice :)

Source / Exemple : 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>CPJS</title>
<script language="javascript">

function ChercherVille(CodePostal){
  
  Form1.CP.options[0].text = "Veuillez patienter"
  document.getElementById("resultat").innerText = "";
  var xmlhttp
  if ( typeof XMLHttpRequest == "object" ) {
    xmlhttp = new XMLHttpRequest();
  }
  if ( typeof ActiveXObject == "object" || typeof ActiveXObject == "function") {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  }

  xmlhttp.open("POST", "http://www.e-naxos.com/scripts/enwscp.dll/soap/IODCODESPOSTAUX",true);
  xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4) {
      document.getElementById("resultat").innerHTML += xmlhttp.responseText;
      var Result = document.getElementById("resultat").innerText;
      var parties = Result.split("|");
      Form1.CP.length = 0;
      for (i in parties){
        var o=new Option(parties[i].split("=")[1],parties[i].split("=")[1]);
        Form1.CP.add(o,-1);
      }
    }
  }

  xmlhttp.setRequestHeader("MessageType", "CALL")
  xmlhttp.setRequestHeader("Content-Type", "text/xml")

  var miSoap='<?xml version="1.0" encoding="UTF-8"?> \n' +
  '<soap:Envelope' +
  '   xmlns:n="urn:ODCODESPOSTAUXIntf-IODCODESPOSTAUX"' +
  '   xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"' +
  '   xmlns:soapenc="http://schemas.xmlsoap.org/soap/encoding/"' +
  '   xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> \n' +
  '   <soap:Body soap:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/"> \n' +                
  '      <n:GetTownForZip> \n' +
  '         <ZipCode xsi:type="xs:string">' + CodePostal + '</ZipCode> \n' +
  '         <Separator xsi:type="xs:string">|</Separator> \n' +
  '      </n:GetTownForZip> \n' +
  '   </soap:Body> \n' +
  '</soap:Envelope>'

    xmlhttp.send(miSoap);

}
    </script>
</head>
<body >
<form name="Form1" method="post" action="CPJS.aspx" id="Form1">
  <input name="CPVille" type="text" onChange="ChercherVille(CPVille.value)">
  <select name="CP" >
    <option value="0">Selectionner votre commune</option>
  </select>
  <div id="resultat" style="visibility:hidden"/>
</form>
</body>
</html>

Conclusion :


j'ai un petit problème: qd on met un autre CP ca ajoute les villes à la liste, j'ai pas reussi à trouver comment enlever les anciens elements. Si vous avez une idée la dessus ...
Ce problème a été resolu.

Hesiter pas à me dire ce que vous pensez de la source et à me mettre une petite note :)

A voir également

Ajouter un commentaire Commentaires
Signaler
Messages postés
20
Date d'inscription
mardi 30 septembre 2003
Statut
Membre
Dernière intervention
12 janvier 2012
Mais il est pas fourni le fichier xml

et quand j'execute la page elle affiche rien et demande une page asp
Signaler
Messages postés
6814
Date d'inscription
dimanche 15 décembre 2002
Statut
Modérateur
Dernière intervention
13 octobre 2010
 28
Tout l'utilité de la source est justement de ne pas avoir de base de donnée mais un appel à un WebService ...
Signaler
Messages postés
20
Date d'inscription
mardi 30 septembre 2003
Statut
Membre
Dernière intervention
12 janvier 2012
Salut pas mal ce code

Je vais l'utiliser pour un formulaire mais tu utilises quel base de données (fichier XML).
Signaler
Messages postés
6814
Date d'inscription
dimanche 15 décembre 2002
Statut
Modérateur
Dernière intervention
13 octobre 2010
 28
Merci pour l'astuce, la source est mis à jour.
Qqn connait une solution pour rendre ce script accesible à tous ? c'est à dire à tout les navigateurs sont configuré IE d'une manière spécial ?
Signaler
Messages postés
3
Date d'inscription
vendredi 25 avril 2003
Statut
Membre
Dernière intervention
26 mai 2004
Pour ton soucis de suppr de ta combobox il faut que tu ajoute ces 2 lignes :

Ligne 9 : document.getElementById("resultat").innerText = '';

Ligne 26 : remplace Form1.CP.remove(0); par
Form1.CP.length = 0;


Tcho !! (Pas mal ta source !! ;) )
Afficher les 7 commentaires
S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (jesusonline)