Récupération de la valeurd'une question

Version imprimable

Bonjour,

Je ne suis qu'un développeur du dimanche (pour l'instant) donc veuillez m'excuser si mon code parait "sale" ou si l'erreur vient d'un code "mal codé".
Je développe actuellement un petit site internet. Mes outils de développement sont MAMP (pour localhost et phpMyAdmin), Firefox (et Firebug) et XCode.
Mon problème tourne évidemment autour de 3 fichiers:

XXX.php contenant le code de la page
requete.php pour me connecter et effectuer mes requetes
question.js avec le code JavaScript pour AJAX

Mon problème: Je n'arrive pas à récupérer la valeur de la question (id) afin de l'utiliser dans l'indice (ind). Dans Firebug, le fichier "requete.php" ne me retourne pas laQuestion.value mais undefined.

Voici les trois morceaux de code utiles (je pense):
XXX.php:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div id="menu">
            <table width=100% height=100%>
 
                <tr>
                     <p style="padding:50px;text-align:center;font-family: Georgia, 'DejaVu Serif', Norasi, serif;text-transform: none; letter-spacing: 0px;font-weight:normal;" id="laQuestion"></p>
                </tr>
                <tr>
                     <td><p id="indice">Indice</p></td>
                     <td>Réponse</td>
                </tr>
                <tr>
                     <td><a href="../index.php"><img width="40%" name="accueil" src="imageQuestion/Retour.png" onmouseover="this.src='imageQuestion/RetourHover.png'" onmouseout="this.src='imageQuestion/Retour.png'"/></a></br>Accueil</td>
                     <td><a href="QuestionTheme.php"><img width="40%" name="accueil" src="imageQuestion/Retour.png" onmouseover="this.src='imageQuestion/RetourHover.png'" onmouseout="this.src='imageQuestion/Retour.png'"/></a></br>Retour Theme</td>
                </tr>
            </table>
        </div>
<script type="text/javascript" src="question.js"></script>

question.js:

Code:

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
var laQuestion = document.getElementById("laQuestion");
var bouton_indice = document.getElementById("indice");
var bouton_reponse = document.getElementById("reponse");
var CheminComplet = document.location.href;
var CheminRepertoire  = CheminComplet.substring(CheminComplet.lastIndexOf( "/" )+1,CheminComplet.lastIndexOf( "." ) );
 
window.addEventListener('load',function(){
                        var ajax = new XMLHttpRequest();
                        ajax.open('POST', 'requete.php', true);
                        ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                        ajax.addEventListener('readystatechange', function(e) {
                                              if(ajax.readyState == 4 && ajax.status == 200){
                                              laQuestion.innerHTML += ajax.responseText;
                                              }
                                              });
                        var data = "type=question&theme="+CheminRepertoire;
                        ajax.send(data)
                        },false);
 
bouton_indice.addEventListener('click',function(){
                              var ajax = new XMLHttpRequest();
                              ajax.open('POST', 'requete.php', true);
                              ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                              ajax.addEventListener('readystatechange', function(e) {
                                                    if(ajax.readyState == 4 && ajax.status == 200){
                                                    bouton_indice.innerHTML += ajax.responseText;
                                                    }
                                                    });
                              var data = "type=indice&selection="+laQuestion.value;
                              ajax.send(data)
                              },false);

requete.php:

Code:

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
$link = mysqli_connect($serveur,$user,$password,$base);
    if (!$link) {
        die('Erreur de connexion');
    }else{
        echo '';
    }
    if ($_POST["type"]=="question") {
        $sq1="SELECT Quest,id FROM Question WHERE Theme='".$_POST['theme']."' ORDER BY RAND() LIMIT 1;";
        if($result = mysqli_query($link, $sq1)){
            while($ligne = mysqli_fetch_assoc($result)){
                $qu=$ligne["Quest"];
                $id=$ligne["id"];
                echo "<option value=".$id.">".utf8_encode($qu)."</option>";
            }
        }
    }
    elseif ($_POST["type"]=="indice") {
        $sq1="SELECT Indice FROM Question WHERE id='".$_POST['selection']."'";
        if($result = mysqli_query($link, $sq1)){
            while($ligne = mysqli_fetch_assoc($result)){
                $ind=$ligne["Indice"];
                echo "<option>".utf8_encode($ind)."</option>";
            }
        }
    }
    mysqli_close($link);

Merci :)

08/01/2016, 11h52
jeremylevy

Salut,

Pour récupérer le contenu de ton paragraphe, tu dois utiliser "innerHTML" et non "value".

Code:

var data = "type=indice&selection=" + laQuestion.innerHTML;

++
08/01/2016, 11h59
MaxouTigrou62

Salut,

Merci pour ton aide mais je veux effectivement récupérer (id) de laQuestion et non la question en elle même. De plus, même avec ce que tu m'indiques, le champs sélection reste à undefined au lieu de prendre la question. Une autre idée? :)

Solution Partielle

Bonjour à tous,

Voici la seule et sale solution que j'ai mise en œuvre. J'espère toujours une meilleure réponse si quelqu'un a une idée. :)

Code:

1
2
3
4
<tr><p style="padding:50px;text-align:center;font-family: Georgia, 'DejaVu Serif', Norasi, serif;text-transform: none;
 letter-spacing: 0px;font-weight:normal;" id="laQuestion">Question:</br>
</p></tr>
<tr><td><p id="indice">Indice</p></td>[...]</tr>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
bouton_indice.addEventListener('click',function(){
                              var ajax = new XMLHttpRequest();
                               var numQuest  = laQuestion.innerHTML.substring(laQuestion.innerHTML.indexOf('"')+1,laQuestion.innerHTML.lastIndexOf('"') );
                              ajax.open('POST', 'requete.php', true);
                              ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                              ajax.addEventListener('readystatechange', function(e) {
                                                    if(ajax.readyState == 4 && ajax.status == 200){
                                                    bouton_indice.innerHTML += ajax.responseText;
                                                    }
                                                    });
                              var data = "type=indice&selection="+numQuest;
                              ajax.send(data)
                              },false);

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
if ($_POST["type"]=="question") {
        $sq1="SELECT Quest,id FROM Question WHERE Theme='".$_POST['theme']."' ORDER BY RAND() LIMIT 1;";
        if($result = mysqli_query($link, $sq1)){
            while($ligne = mysqli_fetch_assoc($result)){
                $qu=$ligne["Quest"];
                $id=$ligne["id"];
                echo "<option value=".$id.">".utf8_encode($qu)."</option>";
            }
        }
    }
    elseif ($_POST["type"]=="indice") {
        $sq1="SELECT Indice FROM Question WHERE id='".$_POST['selection']."'";
        if($result = mysqli_query($link, $sq1)){
            while($ligne = mysqli_fetch_assoc($result)){
                $ind=$ligne["Indice"];
                echo "<option>".utf8_encode($ind)."</option>";
            }
        }
    }