Sujet Précédent Sujet Suivant

Quizz html / php / js

Fermé
louise63 - Modifié par jordane45 le 27/12/2015 à 15:51
 louise63 - 28 déc. 2015 à 12:54
Bonjour,

J'ai créé un quizz en lien avec ma base de donné. descrption correspond au titre du quizz, question aux 4 questions et texte aux 8 réponses possible. Chaque réponse à une value = 1 ou =0 suivant si elle est juste ou fausse. ( good dans ma table)
J'ai un problème pour le bouton valider de mon quizz. Mon quizz se trouve sur une page quizz.tpl le code est le suivant 
{extends file="layout.tpl"}
{block name=body}

{foreach from=$quizzs item=quizz}
<div class='container'>
<section class="col-lg-12">
<div class="title1 col-lg-12">
<p>{$quizz.description}</p>
</div>

   
</section>
</div>
{/foreach}

{foreach from=$questions item=question}
<div class='container'>
<section class="col-lg-12">
   <div class="title col-lg-12">
    <p>{$question.question}</p>
   </div>

{foreach from=$props[$question.id] item=prop}
   <div class=" quizz col-lg-12">
   <input type="radio" name="{$prop.id_questions}" value ="{$prop.good}" />  {$prop.texte}
   </div>
{/foreach}  
</section>
</div>
{/foreach}

<input name="quizzBtn" value="Valider mes réponses" id="quizzBtn" onclick="resultat()" type="button" class="btn btn-default btn-lg">

et j'ai un main.js avec le code pour activer mon boutton : 
$(document).ready( function(){

var point = 0;

//calcul du score
function calcul(value,point) {
if (value == 1) { point=point+1;}
else { point=point+0 ; }
}


$('#quizzBtn').click(function(){

 function resultat() {calcul();
 if (point>3) {alert("Ton score est de "+point+" , bravo !!!!");}
 else {alert("Ton score est de "+point+". Ce sera mieux la prochain fois ;)");}
 }
});
});


mais quand je clique sur mon bouton valider rien ne se passe..

Merci de votre aide





EDIT : AJOUT DES BALISES DE CODE.
A voir également:

1 réponse

Réponse 1 / 1
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
27 déc. 2015 à 15:52
Bonjour,

La première chose à faire est d'ouvrir la console dans ton navigateur.
Je te conseille par ailleurs d'utiliser celle fournie par le plugin FIREBUB (pour FireFox).
Tu verras alors si des messages d'erreurs javascript apparaissent.
0
louise63
Modifié par jordane45 le 28/12/2015 à 02:25
fire bug me donne la réponse suivante "uncaught exception: out of memory" , lorsque je cloique sur validé l'alerte "Ton score est de 0". Ce sera mieux la prochain fois ;)" donc les point ne sont pas compté la function calcul ne marche pas

voici mon nouveau code js: 
$(document).ready( function(){

var point = 0;

//calcul du score
function calcul(value,point) {
  if (value == 1) { point=point+1;}
    else { point=point+0 ; }

}

$('#quizzBtn').click(function(){

//function resultat() {calcul();
if (point>3) {alert("Ton score est de "+point+" , bravo !!!!");}
else {alert("Ton score est de "+point+". Ce sera mieux la prochain fois ;)");}
 

});

 });

et mon tpl: 
{extends file="layout.tpl"}
{block name=body}

<from action="quizz" method="POST">
{foreach from=$quizzs item=quizz}
<div class='container'>
<section class="col-lg-12">
   <div class="title1 col-lg-12">
    <p>{$quizz.description}</p>
   </div>

   
</section>
</div>
{/foreach}

{foreach from=$questions item=question}
<div class='container'>
<section class="col-lg-12">
   <div class="title col-lg-12">
    <p>{$question.question}</p>
   </div>

{foreach from=$props[$question.id] item=prop}
   <div class=" quizz col-lg-12">
   <input type="radio" name="{$prop.id_questions}" value ="{$prop.good}" />  {$prop.texte}
   </div>
{/foreach}

   
</section>
</div>
{/foreach}

 <input name="submit" value="Valider mes réponses" id="quizzBtn" type="button" class="btn btn-default btn-lg">
 </from>


   {/block}



EDIT : Ajout des balises de code. (la coloration syntaxique )
Explication disponible ici : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

Merci d'y penser à l'avenir.
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > louise63
28 déc. 2015 à 02:39
Il y a plusieurs soucis dans ton "nouveau" code.

1 - .. tu ne fais plus appel à la fonction calcul()
2 - Cette fonction calcul attend deux arguments... hors... tu ne lui en passes aucun !

3 - Pour faire ce "calcul" .. il te faut surement boucler sur tout tes boutons radios et, si coché, prendre la VALUE correspondante....

Ce qui, au final, devrait donner un truc du genre : 
var point = 0;
function calcul() {
 //Boucle sur tous les input radio cochés
$('input:radio:checked').each(function(index, element) {
    var valueChecked = $(element).val();
    point = point + valueChecked ;
  
  });

}

$(document).ready( function(){
  $('#quizzBtn').click(function(){
    calcul(); // On relance les calculs
     console.log("nb points ="+point); //le temps des tests pour affifchage dans la console
    if (point>3) {
      alert("Ton score est de "+point+" , bravo !!!!");
    }else {
      alert("Ton score est de "+point+". Ce sera mieux la prochain fois ;)");
    }
   });

 });
0
louise63
28 déc. 2015 à 12:54
Merci j'ai compris mon erreur. Maintenant j'ai un autre problème.. il me semble que les points ne s'ajoute pas entre eux le message affiché a=quand je valide est le suivant "Ton score est de 011111 , bravo !!!!"
0

Discussions similaires

ALERT en php
snoopy -
appkech -

14 réponses
Javascript Arrondi à 2 chiffres après la virgule
jeremy -
gravityaerox -

12 réponses
&nbsp ; Quelle Fonction ?
-Jeff- -
sl4ck -

14 réponses
Espace en HTML
baissaoui -
baissaoui -

0 réponse
balise de retour à la ligne en php
2I++ -
Naguez Abderraouf -

5 réponses