Questionnaire JQUERY/PHP - variable vide
Bonsoir à tous et à toutes,
Je fais appel à votre aide puisque cela fait plusieurs heures que je sèche sur une anomalie, dont je n'arrive pas à trouver la cause.
Je cherche à créer un questionnaire interactif en PHP/JQUERY et tout fonctionne sauf le plus important à savoir la remontée du score final a l'utilisateur.
Je m'explique...
Le script JS va verifier (via une boucle) pour chaque réponse sélectionnée (via requete AJAX) si le code réponse est bien égal à 1.
Si c'est le cas il additionne +1 au score global, et stocke cela dans une variable "total" et affecte la valeur de cette variable à un élément du DOM qui est caché (<p id="score_value"></p>)
Ensuite une autre fonction est censée récuperer la valeur de (<p id="score_value"></p>), stocker l'info dans la base de données et informer l'utilisateur.
Sauf que dans cette variable la valeur retournée de (<p id="score_value"></p>) est nulle et je ne comprends pas pourquoi.
J'ai sans doutes du faire une erreur quelque part mais je ne vois pas ou.
Je vous serais extremement reconnaissant de me dire quelle erreur j'ai pu faire car je ne vois du tout (J'ai essayé beaucoup de modifications sans succès).
Je suis à l'écoute de tout vos conseils avisés.
Pour vous aider voici le code en question qui me pose probleme :
LA PARTIE HTML / 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
27
28
29
30
31
32
| <div class="container-fluid">
<!-- AFFICHAGE DU SCORE DE L'UTILISATEUR -->
<p id="score_value"></p>
<div id="score"></div>
<!-- FORMULAIRE DE CHOIX DU THEME DU QUESTIONNAIRE -->
<div class="col-lg-3">
<div class="panel panel-primary">
<div class="panel-heading">CHOIX DU THEME DE QUESTIONS</div>
<div class="panel-body">
<form>
<div class="form-group">
<select class="form-control" id="themeQuestion">
<?php
$sql_themes= "SELECT theme FROM themes";
$req_themes = mysqli_query($conn,$sql_themes);
foreach ($req_themes as $data) {?>
<option value="<?php echo $data['theme']?>"><?php echo $data['theme']?></option>;
<?php }?>
</select>
</div>
<a href="#" class="btn btn-primary" id="confirm_theme_questionnaire">VALIDEZ</a>
</form>
</div>
</div>
</div>
<div class="col-lg-9" id="displayQuestions">
<!-- AFFICHAGE DYNAMIQUE DES QUESTIONS -->
</div>
<a href="#" class="btn btn-success col-lg-12" id="confirm_reponses_questionnaire">VALIDEZ LES REPONSES</a>
</div><!-- fin du container --> |
LA PARTIE JQUERY :
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
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
97
98
99
100
101
102
103
| <script>
$(function(){
//AFFICHAGE DES QUESTIONS EN RAPPORT AVEC LE THEME CHOISI ET DESACTIVATION DU BOUTON
$("#confirm_theme_questionnaire").on('click', function(){
var theme = $("#themeQuestion").val();
//AJAX
$.ajax({
method : 'POST',
url: "ajax/questionnaire.php?action=recupQuestions",
data : {theme : theme},
dataType : 'html',
success: function(data)
{
$("#displayQuestions").show().html(data).fadeIn(4000);
$("#score_value").hide();
}
});//!! AJAX
});//FIN FONCTION
//ENVOI DES REPONSES ET VERIFICATION ET STOCKAGE DANS LA BASE DE DONNEES
$("#confirm_reponses_questionnaire").on('click',function(){
$("#confirm_reponses_questionnaire").fadeOut('slow');
$("#score_value").text(0);
//POUR CHAQUE BOUTON RADIO SELECTIONNE VERIFIER SI LA REPONSE EST OK EN BDD
//SI CODE REPONSE =1 C'EST LA BONNE REPONSE SINON ELLE EST FAUSSE
$('input[type=radio]:checked').each(function(){
var reponse = $(this).val();
//console.log(reponse);
$.ajax({
method : 'POST',
url: "ajax/questionnaire.php?action=checkReponses",
data :
{
reponse : reponse
},
dataType : 'html',
success: function(data)
{
//$("#validerChoixTheme").addClass('disabled');
var retourReponse = JSON.parse(data);
var codeReponse = retourReponse.code
//SI CODE REPONSE = 1 LA REPONSE EST BONNE ET ON AJOUTE +1 AU SCORE
//ET ON MET LE CHAMP RADIO ENTOURE EN VERT
if (codeReponse == 1 )
{
var score = $("#score_value").text();
var chiffre = parseInt(score);
var reponseOk = parseInt(1);
var total = chiffre + reponseOk;
$("#score_value").text(total);
}
}
});//FIN REQUETE AJAX
});//FIN BOUCLE DE VERIF DES REPONSES
checkAndSaveScore();
});//FIN FONCTION
/* ************************* FONCTIONS GLOBALES JQUERY ********************************** */
//FONCTION DE VERIFICATION DU SCORE ET AFFICHAGE DU RESULTAT AU USER
function checkAndSaveScore()
{
// AJAX POUR AFFICHER LE MESSAGE PERSONNALISE EN FONCTION DU SCORE
var score = $("#score_value").text();
var user = $("#user_logged").text()
$.ajax({
method : 'POST',
url: "ajax/questionnaire.php?action=checkScore",
data :
{
score : score,
user : user
},
dataType : 'html',
success: function(data)
{
$("#score").html(data).show();
}
});//FIN REQUETE AJAX
}//FIN FONCTION GLOBALE
});//FIN SCRIPT JQUERY |
Je vous souhaite une bonne soirée.
