IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[Ajax] pb avec 3 combos listes recupérant les infos via mysql


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Inscrit en
    Juillet 2005
    Messages
    19
    Détails du profil
    Informations forums :
    Inscription : Juillet 2005
    Messages : 19
    Par défaut [Ajax] pb avec 3 combos listes recupérant les infos via mysql
    Bonjour,

    Je cherche à faire un système de 3 combos listes liées entre elles (themes, sous-themes, projets) et récupérant les infos dans trois tables mysql (proj_themes, proj_ssthemes et mod_projets). J'ai trouvé un certain nombre d'infos (pour ne pas dire de très nombreuses) sur le forum. J'arrive à faire marcher le tout pour 2 combos listes, mais la troisième me pose bien des problèmes.
    J'arrive à faire marcher le système a 3 combos listes si les données sont dans des tableaux en bruts sur la page, mais avec des bdd, tout se complique.

    J'ai procédé en mettant un onchange() sur la première combo liste qui crée la seconde combo liste dans un bloc div en faisant appel à un script php, lorsque l'événement se déclenche. Dans cette seconde combo liste, il y a également un onchange() qui est censé créer la troisième combo liste, mais étrangement, ce script ne s'exécute jamais.
    J'ai l'impression que la cause de la non exécution de ce script est du au fait que au départ, l'appel à ce script, n'est pas sur la page, mais qu'il n'apparait qu'une fois que le premier script s'exécute.
    J'ai cru comprendre qu'il fallait que j'ajoute des regexp et des eval peu après les innerHTML dans le code javascript. J'ai essayé mais sans succès.

    Voici la partie du code concernée ($homepage -> atjs ajoute du code dans une balise <script language=...> et $homepage -> atc fait des "echo " sur la page pour résumer et faire court) :

    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
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
     
    Sur la page php principale compterendu_assoc.php: 
    		$homepage -> atjs ("
                            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; 
                                    } 
                            }
     
                            function gosstheme(){
                                    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('ssthemes').innerHTML = leselect;
                                            }
                                    }
     
                                    // Ici on va voir comment faire du post
                                    xhr.open(\"POST\",\"compterendu_assoc_sstheme.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 de l'auteur
                                    sel = document.getElementById('themes');
                                    idtheme = sel.options[sel.selectedIndex].value;
                                    eval(xhr.send(\"idtheme=\"+idtheme));
                            }  
     
           						function goprojet(){
                                    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('sssprojets').innerHTML = leselect;
                                            }
                                    }
     
                                    // Ici on va voir comment faire du post
                                    xhr.open(\"POST\",\"compterendu_assoc_projet.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 de l'auteur
                                    sel = document.getElementById('ssthemes');
                                    idsstheme = sel.options[sel.selectedIndex].value;
                                    eval(xhr.send(\"idsstheme=\"+idsstheme));
                            }                       
     
                    ");
     
     
    	$homepage -> atc ("<form action=\"compterendu_assoc.php?hopital=".$_GET['hopital']."&action=ajoutercr... name=\"mainForm\" id=\"mainForm\" method=\"post\">
    		<label for=\"theme\" class=\"formlabel\">Th&egrave;me :</label>
    		<select name='themes' id='themes' onchange='gosstheme()'>
    		<option value='-1'></option>");
     
    		$res=mysql_query("SELECT * FROM proj_themes ORDER BY nom");
    		while($row = mysql_fetch_assoc($res)){
    			$homepage -> atc ("<option value='".$row["id"]."'>".$row["nom"]."</option>");
    		}
    		$homepage -> atc ("
    		</select>
     
    		<label for=\"ssthemes\" class=\"formlabel\">Sous-th&egrave;me :</label>
    		<div id='ssthemes'> 
    			<select name='ssthemes' onchange='goprojet()'>
    				<option value='-1'></option>
    			</select>
    		</div>
     
    		<label for=\"projets\" class=\"formlabel\" >Nom du projet :</label>
    		<div id='sssprojets'> 
    			<select name='sssprojets'>
    				<option value='-1'></option>
    			</select>
    		</div>
    </form>");
    Ensuite les deux scripts appelées par les fonction javascript gosstheme() et goprojet()
    1- compterendu_assoc_sstheme.php
    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
     
    <?php
            echo "<select name='ssthemes' onchange='goprojet()'>";
            if(isset($_POST["idtheme"])){
                    mysql_connect("localhost","root",$lemdp);
                    mysql_select_db($labase);
                    echo "<option value='-1'></option>";
                    $res = mysql_query("SELECT id,nom FROM proj_ssthemes 
                            WHERE idtheme=".$_POST["idtheme"]." ORDER BY nom");
                    while($row = mysql_fetch_assoc($res)){
                            echo "<option value='".$row["id"]."'>".$row["nom"]."</option>";
                    }
            }
            echo "</select>";
    ?>
    2 - compterendu_assoc_projet.php
    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
     
    <?php
            echo "<select name='sssprojets'>";
            if(isset($_POST["idsstheme"])){
                    mysql_connect("localhost","root",$lemdp);
                    mysql_select_db($labase);
                    echo "<option value='-1'></option>";
                    $res = mysql_query("SELECT idprojet,nom FROM mod_projets 
                            WHERE idsoustheme=".$_POST["idsstheme"]." ORDER BY nom");
                    while($row = mysql_fetch_assoc($res)){
                            echo "<option value='".$row["idprojet"]."'>".$row["nom"]."</option>";
                    }
            }
           echo "</select>";
    ?>

    Je vois une alternative possible en modifiant les deux derniers scripts php. Il faudrait ajouter des "options" en fonction du résultat d'un requête à des objets select existants de la page principale. J'ai essayé mais sans succès car je ne vois pas comment faire référence à ces select situés sur la page principale depuis les petits scripts php.
    Voici une ébauche de code qui ne fonctionne pas. Si quelqu'un sait comment corriger ca, ca serait super.(en gros la ligne avec le mainForm..., mainForm étant le name du formulaire dans l'autre page, et celle avec l'appel de la fonction javascript ajouter)
    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
                   if(isset($_POST["idtheme"])){
                    mysql_connect("localhost","root",$lemdp);
                    mysql_select_db($latable);
                    echo "<SCRIPT LANGUAGE=\"JavaScript\">
                                                    function ajouter(id,nom) {
                                                            var o=new Option(nom,id);
                                        mainForm.ssthemes.options[mainForm.ssthemes.options.length]=o;
                                                    }";
                    $res = mysql_query("SELECT id,nom FROM proj_ssthemes 
                            WHERE idtheme=".$_POST["idtheme"]." ORDER BY nom");
                    while($row = mysql_fetch_assoc($res)){
                            echo "ajouter(".$row['id'].",".$row['nom'].");";
                    }
                    echo "</SCRIPT>";
            }
    ?>

    Voila, j'espère ne rien avoir oublié afin que ca soit compréhensible. Tout aide est la bienvenue. Ca fait des heures que j'essaye de faire marcher cela.
    Merci d'avance
    Laurent
    ps: je suis archi nul en javascript.

  2. #2
    Membre Expert
    Avatar de FremyCompany
    Profil pro
    Étudiant
    Inscrit en
    Février 2006
    Messages
    2 532
    Détails du profil
    Informations personnelles :
    Âge : 33
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Février 2006
    Messages : 2 532
    Par défaut
    je n'ai pas tout compris mais :
    1/ eval s'utilise sans les <script> etc. [ex : eval("alert('')")]
    2/ on n'écript pas <SCRIPT LANGUAGE="JavaScript"> mais <script language="javascript" type="text/javascript">
    3/ on utilise escape(idTheme) pour le transformer en argument valide pour URL

Discussions similaires

  1. Réponses: 1
    Dernier message: 13/05/2013, 20h52
  2. recupérer les info d'une table X pour alimenter une table Y
    Par lemerite dans le forum MS SQL Server
    Réponses: 3
    Dernier message: 09/09/2008, 11h31
  3. lancer un script shell et recupérer les résultats via script python
    Par GoldenEyes dans le forum Général Python
    Réponses: 2
    Dernier message: 04/09/2008, 18h15
  4. Recupérer les info d'une page dans une autre
    Par Chikh001 dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 12/07/2006, 08h34
  5. Recupérer les info d'une page dans une autre
    Par Chikh001 dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 11/07/2006, 12h36

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo