bonjour tout le monde,
Vous allez crier car c'est un problème récurrent sur les forums!
encore un soucis avec une liste traitée en ajax (sans xml ),
j ai parcouru le web en m'inspirant de divers cours traitant de "xmlhttprequest"
mais je reste tout de même coincé depuis plus de 2 jour maintenant.
L'idée est d'entrer un code postal dans un champ texte,
puis de generer à coté une liste deroulante affichant le ou les résultats.
Je mets tous ce que j ai fais pour l instant:
La table SQL
La page formulaire et le JS
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7 CREATE TABLE `cpville` ( `idville` int(10) NOT NULL auto_increment, `cp` varchar(5) NOT NULL default '', `ville` varchar(20) NOT NULL default '', PRIMARY KEY (`idville`,`cp`,`ville`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=8 ;
le traitement PHP SQL
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51 <script language="Javascript" type="text/JavaScript"> var xhr = null; function getXhr(){ if(window.XMLHttpRequest) // Firefox et autres xhr = new XMLHttpRequest(); else if(window.ActiveXObject){ // Internet Explorer try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } } else { // XMLHttpRequest non supporté par le navigateur alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); xhr = false; } } /* Méthode qui sera appelée sur le click du bouton*/ function go() { getXhr() xhr.onreadystatechange = function(){ if(xhr.readyState == 4 && xhr.status == 200){ document.getElementById("CP").innerHTML; // Texte renvoyé par la page cible (url_cible) var valeur_retour = xhr.responseText; document.getElementById("Ville").value = valeur_retour; } } // envoi avec post xhr.open("POST", "testcp.php", true); // ne pas oublier ça pour le post xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); var sel = document.getElementById("CP"); id_dept = sel.value; xhr.send('CP='+ id_dept); } <body> // formulaire <form name="form" method="post" action="testcp.php"> <label>Secteur d'activité:</label> <input type="text" size="5" name="cp" id="CP" onblur="go()" /> <div> <select id ='ville' name='ville' > <option value='-1'>Choisir un secteur</option> </select></div>
Le problème est que la liste devant contenir le resultat reste vide.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18 <?php header('Content-type: text/html; charset=iso-8859-1'); // script PHP interrogation Base de donnees pour reponse a la requette AJAX include ("connexion.php"); if(isset($_POST['CP'])){ //connexion à la base $AccesBase = mysql_connect($host,$username,$passSQL); mysql_select_db($bdd,$AccesBase); $QuestionBase = "SELECT * FROM cpville WHERE cp =".$_POST['cp'].""; $result_recherche = mysql_db_query($bdd, $QuestionBase) or die (mysql_error()); // construction de la liste deroulante while ($row=mysql_fetch_assoc($result_recherche)){ echo "<option>-- Choisissez --</option>"; echo "<option value='".$row["idville"]."'>".$row["ville"]."</option>"; } } ?>
la page PHP ne retourne pas d'erreur,
je pense que je n'arrive pas à manipuler la construction de ma liste via DOM peut etre.
en tous cas là je suis trop bloquer, j ai du oublier quelque chose, alors si un oeil vif en javascript arrive à desceller quelques erreurs, Merci d'avance.
Partager