Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1820 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML/Css/Javascript] Listes liées avec la librairie prototype

 



 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[HTML/Css/Javascript] Listes liées avec la librairie prototype

n°1952434
fabulon
Posté le 22-12-2009 à 15:20:27  profilanswer
 

Bonjour,
Ne parvenant pas à me débrouiller avec les requêtes ajax, j'ai essayé de suivre des tutos utilisant la librairie prototype.
 
Ce que je veux, c'est faire 2 listes liées dynamiquement.
Donc un premier select, qui amène à faire une requete ajax, qui amène sur un fichier php utilisant la valeur du 1er select, et renvoie une valeur à mettre dans le 2nd select.
 
Voilà ce que ça donne:
http://gambetta.cahors.free.fr/exemple/
C'est à dire pas grand chose!
J'ai l'impression qu'il y a 2 soucis:
- le premier: la valeur choisie dans mon premier select n'est pas transmise dans le fichier .php
- le second: le résultat n'est pas transmis dans le 2nd select.
 
J'ai fait un paquet des qq fichiers de mon prog:
http://gambetta.cahors.free.fr/exemple/exemple.rar
 
En voici qq extraits:
Le form dans le fichier principal index.php

Code :
  1. <form method = "post" name = "socle" action="socle.php">
  2.  <p align = "center">
  3.  <select   name="tb1" id="tb1"   size=1  onchange='requete_ajax();'>
  4.   <?php
  5.   for ($nb=0;$nb<$max;$nb++)
  6.   {  $i=mysql_result($res,$nb,$table1_champ1);
  7.   echo '<option>'.$i.'</option>'; 
  8.   }
  9.   ?> 
  10.  </select>
  11.  <select    name="eleve" id="emplacement"   size=1>  </select>
  12.  </p>
  13.  <p>&nbsp;</p>
  14.         <p align="center"><input TYPE="submit" VALUE="Envoyer" ></p>
  15. </form>


 
 
Ma fonction requete_ajax:

Code :
  1. function requete_ajax() {
  2. var url = 'remplir2ndselect.php';
  3. var parametres = 'tb1';//Les paramètres que l’on va fournir (par GET ou POST voir plus bas)
  4. var myAjax = new Ajax.Updater( //Création d’une requête Ajax toute faite !)
  5. 'emplacement', //Le nom du div qui va recevoir les infos de la page php lancée
  6. url, //url de la page lancée
  7. {
  8. method: 'get', //Méthode pour les paramètres (GET ou POST)
  9. parameters: parametres //Paramètres rentrés plus haut
  10. }
  11. );
  12. } //C’est tout !

 
 
Et le fichier php pour remplir le 2nd select:

Code :
  1. <?php
  2.    header('Content-type:text/html;charset=ISO-8859-1');
  3. include ('connexion.php');
  4. $table1='classe';
  5. $table2='socle';
  6. $table1_champ1='classe';
  7. $table2_champ1='classe';
  8. $table2_champ2='eleve';
  9. $choix1=$_GET['tb1'];
  10.    $rch="WHERE $table2_champ1 ='" .$choix1. "'";
  11.    $res=mysql_query("SELECT * FROM $table2 ".$rch);
  12.    $max=@mysql_num_rows($res);
  13. $t="";
  14.    for ($nb=0;$nb<$max;$nb++)
  15.    {  $i=mysql_result($res,$nb,"$table2_champ2" );
  16.       $t.="\t".$i; 
  17. }
  18. echo $t;
  19. echo 'bonjour';
  20. ?>


 
Help


Message édité par fabulon le 23-12-2009 à 18:27:23
mood
Publicité
Posté le 22-12-2009 à 15:20:27  profilanswer
 

n°1952446
stealth35
Posté le 22-12-2009 à 15:57:11  profilanswer
 

verifie ton fichier 2nd select, peu importe l'option il ecrit rien
sinon ca a l'air bien parti


Message édité par stealth35 le 22-12-2009 à 15:57:55
n°1952482
fabulon
Posté le 22-12-2009 à 17:17:12  profilanswer
 

Le fichier remplir2ndselect.php en lui même fonctionne: si je le teste à part, il me sort bien les valeurs qu'il faut.
 
Il y a un souci avant: quand on arrive dans ce fichier remplir2ndselect.php, la variable 'tb1' n'est pas passée par la méthode get.
Il y a un souci après: les valeurs ne sortent pas de ce remplir2ndselect.php ne parviennent pas jusqu'à la deuxième balise select.
 
Bref, ça coince.

n°1952487
stealth35
Posté le 22-12-2009 à 17:21:44  profilanswer
 

non
quand j'ouvre ca

 

http://gambetta.cahors.free.fr/exe [...] ct.php?tb1

 

ca rend rien

 

faut faire
?type=tb1

 

echo $_GET['type']
te rendra 'tb1'


Message édité par stealth35 le 22-12-2009 à 17:22:53
n°1952502
fabulon
Posté le 22-12-2009 à 17:44:19  profilanswer
 

Si je tape ça: http://gambetta.cahors.free.fr/exe [...] php?tb1=6A
ça me renvoie: TOTO TUTU qui sont les 2 valeurs à mettre dans le select.
 

Citation :

faut faire
?type=tb1
 
 
echo $_GET['type']
te rendra 'tb1'


Où ça? Comprends pas.


Message édité par fabulon le 22-12-2009 à 17:44:39
n°1952524
stealth35
Posté le 22-12-2009 à 18:16:20  profilanswer
 

oui la c'est bon, mais ta requete n'envoie rien ca envoie
http://gambetta.cahors.free.fr/exe [...] ct.php?tb1

 

nul part tu lui dis de rendre  6A ou 6B
faut que dans ta fonction tu recureres le value du select


Message édité par stealth35 le 22-12-2009 à 18:18:29
n°1952533
fabulon
Posté le 22-12-2009 à 18:34:47  profilanswer
 

Citation :

faut que dans ta fonction tu recureres le value du select


Il me semblait que c'est ce que je faisais, puisque j'écris quelque chose qui ressemble à ça:
 
var myAjax = new Ajax.Updater( 'emplacement' , 'remplir2ndselect.php' { method: 'get', parameters: 'tb1' } );
 
'emplacement' est l'id qui va recevoir le résultat.
'remplir2ndselect.php' est le fichier qui est appelé et qui va être executé.
{ method: 'get', parameters: 'tb1' } indique que le paramètre (ou variable ?) qui va être transmis par la méthode get est 'tb1'.
 
Non?
 
 
 

n°1952542
stealth35
Posté le 22-12-2009 à 18:41:11  profilanswer
 

non la ca ta met rien
pas sur sur mais va falloir faire un truc du style
 

Code :
  1. var value = document.getElementbyId('tb1').value;
  2. var parametres = 'tb1=' + value;


n°1952551
fabulon
Posté le 22-12-2009 à 18:52:36  profilanswer
 

j'ai essayé ça:
 
function requete_ajax() {
 
var parametres = 'tb1=' + document.getElementbyId('tb1').value;
var myAjax = new Ajax.Updater( 'emplacement' , 'remplir2ndselect.php' { method: 'get', parameters: parametres } );  
 
}
 
Mais sans résultat.

n°1952567
stealth35
Posté le 22-12-2009 à 19:23:22  profilanswer
 

ouai, faut que tu trouve la fonction pour recuperé la valeur de ton select
 
document.getElementbyId('tb1').value te renvoi ton champs deja ?
 
sinon y'a avec  document.forms aussi
 
a toi de voir dans firebug les valeur de tout ca, de la recupere et de l'envoyer

mood
Publicité
Posté le 22-12-2009 à 19:23:22  profilanswer
 

n°1952581
fabulon
Posté le 22-12-2009 à 20:42:56  profilanswer
 

J'ai essayé de voir ce que faisait firebug.
Voilà le 1er bug rencontré:
 
http://img687.imageshack.us/img687/9619/96855724.jpg
 
Je suis perplexe...


Message édité par fabulon le 22-12-2009 à 20:43:57
n°1952583
stealth35
Posté le 22-12-2009 à 21:04:11  profilanswer
 

c'est getElementById, avec les maj

n°1952585
fabulon
Posté le 22-12-2009 à 21:19:29  profilanswer
 

Ca avance!!!
 
Voilà où j'en suis:
http://img192.imageshack.us/img192/5476/capturegq.jpg
 
La fonction n'a, à priori, plus à être retouchée.  
Ensuite, dans les paramètres, il ne fallait pas mettre 'tb1=' mais au contraire prendre une nouvelle variable, et lui affecter la valeur de tb1.

Code :
  1. function requete_ajax() {
  2. var valeur = window.document.getElementById("tb1" ).value;
  3. var parametres = 'classe='+valeur;
  4. var myAjax = new Ajax.Updater( 'emplacement' , 'remplir2ndselect.php' , { method: 'get', parameters: parametres } );
  5. }


 
C'est au niveau du remplissage du 2nd select que ça foire.

Code :
  1. <?php
  2.    header('Content-type:text/html;charset=ISO-8859-1');
  3. include ('connexion.php');
  4. $table1='classe';
  5. $table2='socle';
  6. $table1_champ1='classe';
  7. $table2_champ1='classe';
  8. $table2_champ2='eleve';
  9. $classe=$_GET['classe'];
  10.    $rch="WHERE $table2_champ1 ='" .$classe. "'";
  11.    $res=mysql_query("SELECT * FROM $table2 ".$rch);
  12.    $max=@mysql_num_rows($res);
  13. $t="";
  14.    for ($nb=0;$nb<$max;$nb++)
  15.    {  $i=mysql_result($res,$nb,"$table2_champ2" );
  16.       $t.="\t".$i; 
  17. }
  18. echo $t;
  19. ?>


 
Cela renvoie les valeurs espacées par un espace.
 
C'est la mise en forme dans le select du prog principal qui merde:
 

Code :
  1. <form method = "post" name = "socle" action="socle.php">
  2.  <p align = "center">
  3.  <select onChange="requete_ajax();" size="1" id="tb1" name="tb1">
  4.   <?php
  5.   for ($nb=0;$nb<$max;$nb++)
  6.   {  $i=mysql_result($res,$nb,$table1_champ1);
  7.   echo '<option>'.$i.'</option>'; 
  8.   }
  9.   ?> 
  10.  </select>
  11.  <select   name="eleve" id="emplacement"   size=1>  </select>
  12.  </p>
  13.  <p>&nbsp;</p>
  14.         <p align="center"><input TYPE="submit" VALUE="Envoyer" ></p>
  15. </form>


Message édité par fabulon le 22-12-2009 à 21:24:29
n°1952587
stealth35
Posté le 22-12-2009 à 21:28:35  profilanswer
 

faut affiche les options apres
 
par contre ton truc pour allé cherché les données c'est vraiment pa terrible
on utilise fetch
 

Code :
  1. while($data = mysql_fetch_assoc)
  2. {
  3.    echo '<option>' . $data['champs'] . '</option>';
  4. }


 
autre question t'a quel version de PHP ?

n°1952592
fabulon
Posté le 22-12-2009 à 21:52:26  profilanswer
 

Je viens d'utiliser ceci, et CA MARCHE!

Code :
  1. <?php
  2.    header('Content-type:text/html;charset=ISO-8859-1');
  3. include ('connexion.php');
  4. $table1='classe';
  5. $table2='socle';
  6. $table1_champ1='classe';
  7. $table2_champ1='classe';
  8. $table2_champ2='eleve';
  9. $classe=$_GET['classe'];
  10.     $liste_eleve = "";
  11.       $SQL = "SELECT * FROM $table2 WHERE $table2_champ1 ='" .$classe. "'";
  12.       $res = mysql_query($SQL);
  13.       while($val = mysql_fetch_array($res))
  14.          $liste_eleve .= "<option value=\"".$val[0]."\">".$val[0]."</option>\n";
  15. echo $liste_eleve;
  16. ?>


 
Par rapport à ce que tu viens d'écrire, en quoi c'est différent?
 
 
Sinon, en local, j'utilise wamp 2.0i, donc php 5.x


Message édité par fabulon le 22-12-2009 à 21:52:42
n°1952593
stealth35
Posté le 22-12-2009 à 21:56:24  profilanswer
 

c'est plus claire,  
et sinon

Code :
  1. $table1='classe';
  2. $table2='socle';
  3. $table1_champ1='classe';
  4. $table2_champ1='classe';
  5. $table2_champ2='eleve';


ca sert a rien
 
et sur ton serveur ca sera quoi comme version de php ?

n°1952594
fabulon
Posté le 22-12-2009 à 21:58:33  profilanswer
 

Exact pour mes 5 lignes... c'était juste pour me repérer par rapport à un autre tuto.
 
Sur mon serveur, ce sera chez Free.
 
 
Sinon, ARGhhh :fou:  Ca ne fonctionne pas avec IE !!!

n°1952595
stealth35
Posté le 22-12-2009 à 22:01:42  profilanswer
 

je pense que ca vien du

 

getElementById

 

essaye de faire un alert (zik !!!) voir ce que ca donne et si ca rend bien le value

 

sinon pourquoi avoi rajouter  window avant document ?


Message édité par stealth35 le 22-12-2009 à 22:02:44
n°1952596
fabulon
Posté le 22-12-2009 à 22:08:39  profilanswer
 

le window avant, c'était juste un essai pour être sur. Cela ne sert à rien en effet.
 
 
Le alert sous FF renvoie la bonne valeur (on s'en serait douté)
Mais il ne renvoie rien sous IE


Message édité par fabulon le 22-12-2009 à 22:11:31
n°1952600
fabulon
Posté le 22-12-2009 à 22:19:15  profilanswer
 

J'ai aussi essayé ça:
var valeur =document.socle['tb1'].value;
 
Ca marche sous FF, mais pas sous IE (le alert ne renvoie rien)

n°1952867
fabulon
Posté le 23-12-2009 à 17:40:38  profilanswer
 

On va cloturer ce post, car le 1er problème est résolu, à savoir utiliser prototype. (c'est ok sous FF)
 
Je vais ouvrir un 2nd post pour voir ce qui cloche entre le document.getElementById et IE

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML/Css/Javascript] Listes liées avec la librairie prototype

 

Sujets relatifs
supprimer une option d'une liste avec javascriptMenu déroulant CSS
Problème de validation W3C (script pris pour du HTML)html, simuler la touche ctrl sur un lien
PAGE HTML SANS CADRE POUR L INDEX ET TOUTE LES AUTRES PAGESProtection contre injection HTML
Importer donné XML vers une page HTMLProblème de redimensionnement image en javascript
html et object image dans le lecteur avant visualisationouvrir une page html en plein écran avec flash
Plus de sujets relatifs à : [HTML/Css/Javascript] Listes liées avec la librairie prototype


Copyright © 1997-2018 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR