Rechercher : dans
Par :

[ajax] listes liées

Dernière réponse le 24 sep 2009 à 22:31:10 redwire, le 17 sep 2006 à 15:16:21 
 Signaler ce message aux modérateurs

J'ai utilisé la méthode exposée dans le tuto http://siddh.developpez.com/articles/ajax/#LIV-A
mais j'ai transposé à une table tb_pays et une table tb_ville....

j'ai beau cherché l'erreur, ma seconde liste est toujours vide quand je choisis un pays....

<?php include("haut.php") ; // contient la connexion avec la base ?>
<div id="corps">
		<script 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();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('ville').innerHTML = leselect;
					}
				}

				// Ici on va voir comment faire du post
				xhr.open("POST","ajaxville.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments
				// ici, l'id du pays
				sel = document.getElementById('pays');
				idpays = sel.options[sel.selectedIndex].value;
				xhr.send("id_pays="+idpays);
			}
		</script>
		<form>
			<fieldset>
				<legend>lieux:</legend>
				<label>pays</label>
				<select name='pays' id='pays' onchange='go()'>
					<option value='-1'>Aucun</option>
					<?
						$res = mysql_query("SELECT * FROM tb_pays ORDER BY id_pays");
						while($row = mysql_fetch_assoc($res)){
							echo "<option value='".$row["id_pays"]."'>".$row["pays"]."</option>";
						}
					?>
				</select>
				<label>ville</label>
				<div id='ville' style='display:inline'>
				<select name='ville'>
					<option value='-1'>Choisir un pays</option>
				</select>
				</div>
			</fieldset>
		</form>
	</div>
	
<?php include("bas.php") ?>


et le fichier ajaxville.php
<?php
	echo "<select name='ville'>";
	if(isset($_POST["id_pays"])){
		$id_pays = $_POST["id_pays"];
		mysql_connect("localhost","root","");
		mysql_select_db("base_setlist");
		$res = mysql_query("SELECT * FROM tb_ville WHERE id_pays = $idpays ORDER BY ville");
		while($row = mysql_fetch_assoc($res))
		{
			echo "<option value='".$row["id_ville"]."'>".$row["ville"]."</option>";
		}
	}
	echo "</select>";
?>


merci:D

1

redwire, le 18 sep 2006 à 18:04:15

Personne? je pige toujours pas pourquoi ça marche pas...

merci...

Répondre à redwire

2

spalc, le 10 mai 2007 à 15:26:05

G exactement le meme soucis... pourtant le tuto à l'air clean. je n'arrive meme pas à faire marcher l'exemple donné (sans rienc changer), la deuxième liste reste vite qd on change la première... as suivre...

Répondre à spalc

3

spalc, le 11 mai 2007 à 12:07:19

Suite a mon précédent post - du nouveau (en bien)
J'ai eu le meme soucis en recopiant exactement le code de SIDDH sur developpez.com. Impossible de le faire marcher, la deuxième liste reste vide.
Par contre en téléchargeant l'archive zip contenant toutes les sources de l'article de SIDDH, ca marche (le code est par endroit différent que celui du tutoriel).
Il faudra juste mettre en commentaire "alert(xhr.readyState);" dans auteurs.php pour éviter les alertes, et ca marche très bien (pour moi en tout cas sous WAMP).

Répondre à spalc

22

 147258, le 24 sep 2009 à 22:31:10

Ol migo como te illemasse

Répondre à 147258

4

cach, le 13 sep 2007 à 10:54:24

Le problème peut être dû à l'emplacement du fichier ajax.php. J'avais mis mon fichier ajax.php dans le dossier ou j'en avais besoin mais en fait il était impossible de l'appeler, j'ai donc mis mon ajax.php dans ma racine. ++

Répondre à cach

5

ted470, le 15 oct 2007 à 13:29:30
  • +1

Salut, moi aussi je me suis pris la tête avec les listes déroulantes, j'ai un bon tuyau si vous le souhaitez :
http://www.roodali.com/...
http://www.roodali.com/...
ces les 2 seuls exemples que j'ai pu faire fonctionner, bon courage

Répondre à ted470

6

dogmongo, le 20 jan 2008 à 17:16:12

Sel = document.getElementById('pays'); c'est la que ca va pas pourquoi "pays"?

Répondre à dogmongo

7

Alain42, le 20 jan 2008 à 18:56:48

Bonsoir,

dans ta page:

<div id='ville' style='display:inline'>
<select name='ville'>
<option value='-1'>Choisir un pays</option>
</select>
</div>


tout ce qui est entre <div id='ville' style='display:inline'> et </div> ne sert à rien puisque tu va écrire par la réponse Ajax <select .... et toutes les options

Mais ce n'est pas ça qui gène.

Essayes en mettant comme requette dans ajax.ph:

		$res = mysql_query("SELECT * FROM tb_ville WHERE id_pays = '".$id_pays."' ORDER BY ville");


car tu as mis $id_pays = $_POST["id_pays"]; un peu plus haut, donc pas bonne variable

de plus il faut des ' de part et d'autre de la valeur à tester.

@lain

Répondre à Alain42

9

Nikoninho, le 24 avr 2008 à 16:17:17

Salut alain42!

Je suis attentivement tes discussions en relations avec les listes déroulantes depuis un moment ==> un grand bravo pour ta patience!!
J'ai essayé de réutiliser ton code car je suis débutant et stagiaire, et que ce dont j'ai besoin est exactement la solution que tu proposes!!

Par contre je rencontre un petit soucis au niveau de ma deuxiéme requete. En effet tout fonctionne trés bien jusqu'a la selection dans la premiere liste, ensuite le navigateur m'affiche un message d'alerte "un probléme est survenu au niveau de la requete"!!
J'ai essayé de retourner cette requete dans tous les sens mais ça ne marche pas!!

J'ai vu que tu as "sauvé" pas mal de personnes, pourraIs-tu en sauver une de plus STP???

je te donnerais plus de renseignements dans mon prochain post si tu me réponds ;)

Merci

Répondre à Nikoninho

10

Alain_42, le 24 avr 2008 à 16:36:14

Salut,

oui je peux te donner un petit coup de main si tu veux.

Quel est ton pb ?

@lain

Répondre à Alain_42

11

Nikoninho, le 24 avr 2008 à 16:53:35

C'est génial!! j'ai réussi à l'adapter merci beaucoup!!!!!!!
J'ai bataillé toute la journée ;)

J'aurais peut-être besoin d'aide un peu plus tard pour quelques conseils.

En tout cas bravo c'est super comme code!

Encore merci

Répondre à Nikoninho

12

Alain_42, le 24 avr 2008 à 16:55:40

C'est vrai que l'Ajax quand on y a goutté ??

Répondre à Alain_42

13

Nikoninho, le 25 avr 2008 à 10:42:30

Salut ALAIN!

Je me permet de te re-déranger pour te poser quelques petites questions :

- Je voudrais afficher (dans le rep_PhpAjax.php) le titre de la seconde liste déroulante comme suit :
<strong><font color="blue">Adresse : </font></strong>
Comment dois-je m'y prendre ?

- Je souhaiterais effectuer une autre application de ton code, je m'explique :
Je souhaite faire apparaître un champs de texte avec une valeur dedans lorsque l'on fait un choix (et uniquement ce choix la) dans la premiere liste déroulante....

J'ai essayé de réutiliser ton code mais je ne suis pas parvenu à le faire marcher, car il est vrai que je n'ai pas tout compris!!
Je te montre les parties de code que j'ai réadapté :

CODE :

branchement.php (qui remplace "listes_liees.php")

<form name="test1" method="post" action="branchement.php"  >

<strong><font color="blue">Source demande : </font></strong>
	<select name="Sourcedelademande" onsubmit="document.test1.submit();" />
	<option value=" "> </option>			
			<option value="SGE" id="sge" onChange=
"makeRequest('datesge.php','sge','datesge')"> SGE </option>
		
			<option value="MAIL" > MAIL </option>
			
			<option value="COURRIER" > COURRIER </option>
				
			<option value="1DG" > 1DG </option>
			
			<option value="CAHORS" > CAHORS </option>
						
			<option value="TELACTF" > TEL ACTF </option>
					
			<option value="PhysiqueATCF" > Physique ATCF </option>
				
			<option value="PôleConseil" > Pôle Conseil </option>
					
			<option value="FAX" > FAX </option>
			
	</select>

<div id="datesge">
	<!-- ici sera charge la reponse mode texte de PHP à la request AJAX -->
	</div>


datesge.php (Qui remplace rep_PhpAjax.php)

<?php
// construction du champ texte
$aff="";
$aff=$aff."
<input name='Sourcedelademande' id='sourcedemande' value="
<?php echo $jour;echo "/";echo $mois;echo "/";echo $annee;?>">
// envoi reponse Php a Ajax	
	echo $aff;
?>

MERCI

Répondre à Nikoninho

14

Alain_42, le 25 avr 2008 à 13:59:49

Salut Nikoninho,

Reponse à ta première question:

<?php
// construction du champ texte
//en faisant   .=    ça concatène la chaine
$aff="";
$aff.="<strong><font color='blue'>Adresse : </font></strong>";
$aff.="<input name='Sourcedelademande' id='sourcedemande' value='".$jour."/".$mois."/".$annee."'>";
// envoi reponse Php a Ajax	
	echo $aff;
?>


j'ai pas mal modifié ta 3 ième ligne $aff.= il ne faut pas remttre <?php puisque tu es déjà dans le php

Répondre à Alain_42

16

Nikoninho, le 25 avr 2008 à 14:28:51

En fait ça marche si je met le onchange dans le "select".
==> ça affiche la date à chaque option

J'aimerais que la date s'affiche uniquement lorsque l'on séléctionne l'option "sge" dnas le menu déroulant.

merci pour ta réponse

Répondre à Nikoninho

15

Alain_42, le 25 avr 2008 à 14:02:34

Grr j'ai mélangé les deux réponses !

Répondre à Alain_42

17

Nikoninho, le 25 avr 2008 à 15:59:56

RE!!

Bon c'est bon j'ai tout réadapté et tout marche nickel!!

- dernier soucis : sous la version d'ie que j'utilise dans l'entreprise lorsque je selectionne une valeur dont je ne fais aucun traitement il m'affiche quand même le div... c'est à dire un leger espace vide aprés le champ...
[à la place du champs qui devrait apparait quand on fait la selection de l'élément associé au traitement (sge...)]

Tu m'as suivi?

Sur la version que j'utilise sur mon portable je n'ai pas ce probleme... cela vient de la version d'internet explorer...
( je suis connecté au réseau de l'entreprise avec mon pc portable et avec un pc de l'entreprise aussi... ce qui me permet de lancer mon application sur le réseau à partir de l'un ou l'autre des ordinateurs)

De même j'ai un autre probléme du même type :
- sur mon pc pas de soucis lorsque je tape "fra" pour rechercher la france dans ma liste de selection c'est bon je tombe direct dessus mais par contre si je me met sur celui ci sa ne marche plus ==> ici j'aurais tous les pays qui commencent par un "a" c'est à dire la dérnière lettre tapée... pourquoi?

Peut-etre y a t-il une option dans les params d'ie???

MERCI

Répondre à Nikoninho

18

Alain_42, le 25 avr 2008 à 17:29:52

lorsque je selectionne une valeur dont je ne fais aucun traitement il m'affiche quand même le div...

si tu as mis onChange dans la balise <select automatiquement tu appelles par Ajax le script php

donc il te répond. Vois si en mettant seulement dans le cas sans traitement:

$aff=""; 
echo aff; 

ça supprimes ton Pb ?

ou alors essayes en remplaçant ton <div id="liste2"></div> par <span id="liste2"></span> ??

- sur mon pc pas de soucis lorsque je tape "fra" pour rechercher la france dans ma liste de selection c'est bon je tombe direct dessus mais par contre si je me met sur celui ci sa ne marche plus ==> ici j'aurais tous les pays qui commencent par un "a" c'est à dire la dérnière lettre tapée... pourquoi?

la je ne vois pas trop, il faudrait que tu me donnes le code des deux fichiers. En MP si tu veux.

Répondre à Alain_42

8

BoOmSoluTioN, le 8 fév 2008 à 18:56:35

Bonsoir;

j'avais le même problème, mais sur firefox seulment;

le probleme :

document.getElementById('ville').innerHTML = leselect;

cette instruction remplace le contenu html de la DIV "ville"; donc le select nomé "livre" sera replacé par un autre, et même si ils ont le même nom (le nouveau et l'ancien select), le firefox ne réussi pas à traiter le nouveau select,

la solution et de garder l'ancien select mais de supprimer son contenu (les options) et le remplacer par un autre, une petite requête sur le "Sheikh" google, j'ai trouver cette "fatwa" :

http://www.dhtmlgoodies.com/index.html?whichScript=ajax_chained_select

c bien fait et réussi,

good luck

Répondre à BoOmSoluTioN

19

i. samson, le 1 jun 2008 à 23:44:52

Enfin une info pertinente sur ce sujet ô combien sensible. merci...

Répondre à i. samson

20

black-ice-50, le 6 jun 2009 à 14:32:38

Bonjour redwire,
j'ai le même problème que toi si t' as encore ton code pourra tu le poster SVP !!

Répondre à black-ice-50

21

fifie30, le 8 sep 2009 à 16:20:45

Bonjour, j'ai moi aussi un problème avec l'application de ce tutoriel. Quelqu'un pourrait-il m'aider à l'appliquer?? Merci d'avance de votre aide.

Répondre à fifie30
Collection CommentÇaMarche.net