Creare un quiz

**castellinascalogrest** · 08-08-2014, 23.17.22

Ciao a tutti! ^^

Volevo creare un quiz tipo il gioco di reazione a catena 'quando dove come perchè'

Ho creato un file HTML:

<html>
<head>
<center>
</head>
<body style="background-color: WHITESMOKE;">
<table style="text-align: left; width: 573px; height: 1000px;"
bgcolor="LIGHTCYAN" border="1" cellpadding="10" cellspacing="10">
<tbody>
<tr>
<td style="vertical-align: top;">
<form action="quiz1.php" method="post" name="Iscrizione Oline">
<center><strong><span style="font-size: x-large;">COME, QUANDO, DOVE, PERCHE </span></strong></center>
<center></center><hr>
<br>
<center><b>Indizio 1: Quando </b><br><br>

QUANDO L'INSEGNANTE HA POSTATO LA SUA LEZIONE
<br><br>Prima risposta: <input name="risposta1" required="" type="text">
<br><br>
<input type="submit" value="Conferma"></center></form>
</td></center>
</tr>
</tbody>
</table>
</body>
</html>

e un file PHP

<html>
<head>
<center>
</head>
<body style="background-color: WHITESMOKE;">
<table style="text-align: left; width: 573px; height: 1000px;"
bgcolor="LIGHTCYAN" border="1" cellpadding="10" cellspacing="10">
<tbody>
<tr>
<td style="vertical-align: top;">
<form action="quiz1.php" method="post" name="Iscrizione Oline">
<center><strong><span style="font-size: x-large;">COME, QUANDO, DOVE, PERCHE </span></strong></center>
<center></center><hr>
<br>
<center><b>Indizio 1: Quando </b><br><br>

QUANDO L'INSEGNANTE HA POSTATO LA SUA LEZIONE <br><br>

<?php

if ($_POST['risposta1'] == "gruppi")
{
print 'Risposta Esatta. Hai guadagnato 5 punti!';
}
else
{
print 'Risposta Sbagliata. Ritenta!';
}
?>

</center>
</td>
</tr>
</tbody>
</table>
</body>
</html>

Se inserisco la parola corretta 'gruppi' mi dà 'risposta esatta' in caso contrario 'sbagliata' e questo è molto elementare XD

Non riesco a fare le seguenti cose ed in giro non sono riuscito a trovare nulla o non sono riuscito ad applicarla (qualunque cosa scrivo dopo print mi dà errore):
-volevo dare un'altra possibilità di risposta al giocatore e quindi, se la risposta è sbagliata, vorrei creare un nuovo spazio 'seconda possibilità'
- Se anche la seconda possibilità fosse sbagliata vorrei mettere il secondo indizio 'quando' con la solita struttura di sopra (uno spazio dove l'utente può scrivere una parola)

Mi potete per piacere dire quale funzione usare e se possibile farmi un esempio?

Scusate, ma sto iniziando ora ad avvicinarmi a questi linguaggi :/

**NLSweb** · 10-08-2014, 00.06.18

Ho trovato interessante la tua domanda , e ho deciso di creare un piccolo esempio
Non uso PHP ma solo HTML e jQuery

la struttura HTML è molto semplice in modo da essere facilmente riadattabile
con H1 definisco la domanda
con H2 segnalo l'esito della risposta
con H3 mostro il suggerimento

Codice HTML:

<div id="finestra">
<h1></h1>
<input type="text" id="risposta1" />
<h2></h2>
<h3></h3>
<div class="pulsante"></div>
</div>

lo script , dopo aver inizializzato la libreria jQuery e atteso il caricamento del documento , genera una matrice per gestire le domande e le risposte , quindi definisce le variabili globali e inizia il gioco.

Codice:

  /* creo una matrice per contenere le domande, le risposte , i suggerimenti e il risultato */
  /* matrice[x][0] = domanda ; matrice[x][1] = risposta ; matrice[x][2] = suggerimento ; matrice[x][3] = risultato */ 
  var matrice = new Array(10);
  for(i=0;i<10;i++){
   matrice[i] = new Array(4);
  }
  /* riempio la matrice con dei valori di esempio */
  for(i=0;i<10;i++){
   matrice[i][0] = "domanda"+i;
   matrice[i][1] = "risposta"+i;
   matrice[i][2] = "suggerimento"+i;
   matrice[i][3] = 0;
  }
  
  var numeroMAXdomande = 10;
  var indiceDomende = 0;
  
  creaDomanda(indiceDomende);
  
  $("#finestra .pulsante").click(function(){
   controllaRisposta(indiceDomende,0);
  });

poi creo le funzioni che gestiscono la partita:

la prima funzione serve per creare una nuova domanda , l'argomento di funzione è l'indice delle domande

Codice:

 function creaDomanda(id){
   $("#finestra h1").html(matrice[id][0]);
   $("#finestra .pulsante").html("Invia Risposta");
  }

la seconda funzione controlla la risposta dell'utente ed esegue l'azione correlata , gli argomenti di funzione sono l'indice delle domande e il numero di risposte provate.
la struttura segue questa regola:
- dopo il primo tentativo sbagliato , si concede un secondo tentativo
- se anche il secondo tentativo fallisce , si mostra il suggerimento e si concede il terzo tentativo

Codice:

function controllaRisposta(id,risp){
   var rispostaUtente = $("#risposta1").val(); 
   
   switch(risp){
    case 0:/* primo temtativo */
    
    if(rispostaUtente===matrice[id][1]){
        rispostaCorretta();   
    }else{
        primaDomanda();
    }
    
    break;
    case 1:/* secondo tentativo */
    
    if(rispostaUtente===matrice[id][1]){
       rispostaCorretta();
    }else{
       secondaDomanda();
    }
       
    break;
    case 2:/* terzo tentativo */
    
    if(rispostaUtente===matrice[id][1]){
       rispostaCorretta();
    }else{
       terzaDomanda();
    }
    
    break;
   }
  }

la terza funzione viene eseguita al primo tentativo errato di risposta

Codice:

function primaDomanda(){
     $("#finestra h2").html("Risposta Sbagliata , prova di nuovo ..");
     $("#finestra .pulsante").off();
     $("#risposta1").val("")
     $("#finestra .pulsante").click(function(){
      controllaRisposta(indiceDomende,1);
     });
  }

la quarta funzione viene eseguita al secondo tentativo errato di risposta

Codice:

function secondaDomanda(){
     $("#finestra h2").html("Risposta Sbagliata , suggerimento ..");
     $("#finestra h3").html(matrice[indiceDomende][2]);
     $("#risposta1").val("");
     $("#finestra .pulsante").off();
     $("#finestra .pulsante").click(function(){
      controllaRisposta(indiceDomende,2);
     });
  }

la quinta funzione viene eseguita al terzo tentativo errato di funzione , e si controlla che il numero di domande non sia finito

Codice:

function terzaDomanda(){
     indiceDomende ++;
     if(indiceDomende<numeroMAXdomande){
      $("#finestra h1").html("");
      $("#finestra h2").html("Risposta Sbagliata , Prossima Domanda.");
      $("#finestra h3").html("");
      $("#risposta1").val("");
      $("#finestra .pulsante").html("Avanti");
      $("#finestra .pulsante").off();
      $("#risposta1").toggle();
    
      $("#finestra .pulsante").click(function(){     
       creaDomanda(indiceDomende);
       $("#risposta1").toggle();
        $("#finestra h2").html("");
       $("#finestra .pulsante").off();
       $("#finestra .pulsante").click(function(){
        controllaRisposta(indiceDomende,0);
       });
      });
    
     }else{
      vittoria();
     }
  }

la sesta funzione viene eseguita quando l'utente risponde correttamente , e si passa alla domanda successiva ; anche qui si controlla che il numero di domande non sia finito

Codice:

function rispostaCorretta(){
     $("#finestra h2").html("Risposta Corretta !");
     matrice[indiceDomende][3] = 1;
     indiceDomende++; 
     if(indiceDomende<numeroMAXdomande){
      $("#finestra .pulsante").html("Domanda Successiva");
      $("#finestra .pulsante").off();   
      $("#finestra .pulsante").click(function(){    
       $("#risposta1").val("");  
       $("#finestra h2").html("");
       $("#finestra h3").html("");
       creaDomanda(indiceDomende);
       $("#finestra .pulsante").off(); 
       $("#finestra .pulsante").click(function(){
        controllaRisposta(indiceDomende,0);
       });
      });
     }else{
      vittoria();
     }
  }

la settima funzione viene eseguito quando il numero di domande è finito e si espone il risultato.

Codice:

function vittoria(){
      var controllo = 0;
      for(i=0;i<numeroMAXdomande;i++){
       controllo += matrice[i][3];
      }
      
      $("#finestra h2").html("Risposte Corrette "+controllo+" di "+numeroMAXdomande+" !");
      $("#finestra h3").html("");
      $("#risposta1").val("");
      $("#finestra .pulsante").off();
     
      $("#finestra .pulsante").click(function(){
       indiceDomende = 0; 
       creaDomanda(indiceDomende);
       $("#risposta1").toggle();
       $("#finestra h2").html("");
       $("#finestra .pulsante").off();
       $("#finestra .pulsante").click(function(){
        controllaRisposta(indiceDomende,0);
       });
      });
     
      $("#finestra .pulsante").html("Gioca di Nuovo");
      $("#finestra h1").html("");
      $("#risposta1").toggle();
      for(i=0;i<10;i++){
       matrice[i][3] = 0;
      }
  }

Spero ti possa aiutare , se hai domande chiedi pure..

10-08-2014, 10.15.53

Originalmente inviato da NLSweb

Non uso PHP ma solo HTML e jQuery

Così se un utente disabilità JS non funziona nulla.
Ed anche basta leggere il sorgente per sapere tutte le domande e tutte le risposte.

Geniale!!!!!

**naviland** · 10-08-2014, 10.57.44

Non penso sia un idea da buttare l'utilizzo di jQuery velocizza molto.
Se un utente che disabilita JS (non ne ho mai visti molti) non potrà giocare gli stamperai un messaggio informandolo, e per le domande/risposte in chiaro nel codice per queste si usi php ma recuperandole tramite AJAX così l'utente non può vederle.

Con jQuery inoltre puoi rendere il tutto più gradevole con qualche effetto di transizione meglio che un semplice invio di un form.

**castellinascalogrest** · 10-08-2014, 19.19.07

JS non l'ho mai utilizzato, ma appena ho un po' di tempo mi metterò a studiarlo e a realizzare la tua idea! Viene proprio carino e questo è un incentivo in più a studiare nuovi linguaggi! :D Grazie mille!

Ora mi si è presentato un problema. Ho messo una funzione random per pescare i dati dal database, ma il problema è che ogni volta che premo invio mi passa dà gli indizi di un'altra riga.

Come posso far rimanere dall'inizio alla fine la parola e i relativi aiuti? Forse obbligando a elaborare lo stesso id? Ma mi serve una mano per capire come fare o da dove iniziare...

Codice PHP:


<?php
 $username="XXX";
 $password="XXX";
 $database="XXX";
 
 mysql_connect(localhost,$username,$password);
 @mysql_select_db($database) or die("Impossibile selezionare il database");
 $query="SELECT * FROM quiz ORDER BY RAND() LIMIT 1";
 $risultati=mysql_query($query);

 $num=mysql_numrows($risultati);
 
 mysql_close();


     $i=0;
     while ($i < $num) {
         $esatta=mysql_result($risultati,$i,"esatta");
         $indizio1=mysql_result($risultati,$i,"indizio1");
         $indizio2=mysql_result($risultati,$i,"indizio2");
          $indizio3=mysql_result($risultati,$i,"indizio3");
           $indizio4=mysql_result($risultati,$i,"indizio4");



if ($_POST[passaggi]=='zero')
{
  print '<center>Ecco il primo indizio (quando) e le tre possibilit&agrave;! Se indovinerai giadagnerai 5 galeoni!<br><br><hr><br><i> 1 Indizio: Quando</i><br><br><b>';
   print $indizio1;
   print ' </b><br><br><hr><br>  Risposta 1  <input type="text" name="risposta1" value="" /><br><br>
       Risposta 2  <input type="text" name="risposta2" value="" /><br><br>
        Risposta 3  <input type="text" name="risposta3" value="" /><br><br>
<input type="hidden" name="passaggi" value="primo"><br/>
    <input type="submit" name="Submit" value="Invia" /><br><br><br>';
 }

    if ($_POST[passaggi]=='primo')
    {

if ($returnValue = strtoupper($_POST['risposta1']) == $esatta || $returnValue = strtoupper($_POST['risposta2']) == $esatta || $returnValue = strtoupper($_POST['risposta3']) == $esatta) 
{ 
   print '<br><br><center><font color="green">Risposta Esatta. Hai guadagnato 5 punti!</font></center> ' ;
 }
else 

{ 
   print ' <center> <b><font color="red">Risposta Sbagliata. Ritenta con un nuovo indizio!</font>
   </b><br><br>Ecco il secondo indizio (dove) e le due possibilit&agrave;! Se indovinerai giadagnerai 3 galeoni!<br><br><hr>
   <br><i> 1 Indizio: Quando</i><br><br><b>';

Non so se mi sono spiegato

FormularioDiDrakensang · 10-08-2014, 20.25.35

Originalmente inviato da naviland

Non penso sia un idea da buttare l'utilizzo di jQuery velocizza molto.

Non mi pare di aver detto il contrario.

Originalmente inviato da naviland

Se un utente che disabilita JS (non ne ho mai visti molti) non potrà giocare gli stamperai un messaggio informandolo,

Per il tipo di gioco che è non mi sembra proprio una gran bella idea. E' perfettamente realizzabile senza JS. Perderà certo esteticamente ma il gioco rimane lo stesso.
Personalmente, sorco il naso (per non dire che sono da buttare) tutte quelle aplicazioni che mi danno troppi vincoli (abilitare JS quando non lo voglio è un vincolo decisamente pesante). Fosse almeno indispensabile ...

Originalmente inviato da naviland

e per le domande/risposte in chiaro nel codice per queste si usi php ma recuperandole tramite AJAX così l'utente non può vederle.

E questo era intrinseco nel primo post, ma se senti la necessità di ribattere, vuol dire che non era poi così palese.

Originalmente inviato da naviland

Con jQuery inoltre puoi rendere il tutto più gradevole con qualche effetto di transizione meglio che un semplice invio di un form.

OK, più gradevole e visivamente accattivante. Ma ciò, ribadisco, non è assolutamente necessario ai fini del pieno uso dell'applicazione, che a mio avviso deve poter girare anche senza.

Una buona applicazione, secondo me, va progettata e realizzata in primis senza JS in modo da renderla fruibile a tutti, e solo in un secondo momento, creare interazioni lato browser coi JS e i suoi vari Framework (jQuery o altri)

**alemoppo** · 10-08-2014, 20.57.45

Originalmente inviato da castellinascalogrest

Come posso far rimanere dall'inizio alla fine la parola e i relativi aiuti? Forse obbligando a elaborare lo stesso id? Ma mi serve una mano per capire come fare o da dove iniziare...

Quando passi "$_POST[passaggi]", lo script non può sapere di quale domanda è riferito, quindi (immagino) mostra l'aiuto di tutte le domande ( e non soltanto l'aiuto di quella che hai richiesto).

Visto che le domande le estrai in modo random (e fin qui è corretto), quando chiedi gli aiuti immagino che le domande cambiano (perché si aggiorna la pagina), e quindi cambia tutto.

Io salverei gli id delle domande estratte nelle sessioni, così finché non invia il quiz compilato, le domande rimangono quelle anche se l'utente non aggiorna la pagina.

Codice PHP:


# guardo se esiste una sessione delle domande

#se non esiste, prendo nuove domande e le metto nella sessione

#mostro le domande guardando se ha chiesto degli aiuti

In generale, per gli aiuti oltre a passare il grado di aiuto (inidzio1, indizio2, indizio3, indizio4), occorre passare anche di che domanda si tratta (e qui tramite id).

Cerca di implementarlo e poi scrivi, come hai fatto ora, fin dove sei arrivato.

p.s: stai usando del codice molto vecchio (ma per funzionare funziona, per ora): per l'interazione con mysql, non si usano più le vecchie funzioni obsolete mysql_*(), ma mysqli_*()
E anche lato HTML, la parte di style è riservata a css. L'html dovrebbe definire soltanto la struttura della pagina. Poi per colore, posizioni etc è compito del CSS. Infatti se guardi, addirittura i tag <center> e <font> sono deprecati e infatti per quanto detto sopra non hanno più senso perché trattano lo stile della pagina.

Ciao!

10-08-2014, 21.15.39

$query="SELECT * FROM quiz ORDER BY RAND() LIMIT 1";

suggerirei di sopprimere questo orrore

**alemoppo** · 10-08-2014, 22.04.19

Originalmente inviato da FormularioDiDrakensang

$query="SELECT * FROM quiz ORDER BY RAND() LIMIT 1";

suggerirei di sopprimere questo orrore

L'unica cosa che non va bene (e non me ne ero accorto) è il LIMIT 1, che rende quindi inutile il while nello script sopra (estrarrà soltanto una domanda).
Puoi spiegare il perché dell'orrore? Grazie.

Ciao!

**NLSweb** · 10-08-2014, 22.22.21

A parte le obbiezioni sull'utilizzo di JS / jQuery , che sono opinabili , l'esempio da me riportato serve a dare un idea di come poter sviluppare questa idea del gioco.
In merito all'obbezione sulla definizione delle domande e risposte che sono visibili da codice sorgente è corretta , ma mi può facilmente ovviare con AJAX che chiama un file PHP per la gereziane delle domande/risposte/suggerimenti prelevandole da un DB che poi le restituisce con JSON , ritornado ad essere fruibili con una matrice e senza aggiornare la pagina.

Se hai dubbi su come procedere , chiedi pure ...

p.s.
Nella sezione "How-To" ci sono esempi di come usare AJAX e JSON

10-08-2014, 22.42.49

@ale

quel codice non è sbagliato di per se ma diventa quasi impossibile eseguirlo

in termini di tempo

mentre la stessa cosa si puo' fare in 0.1 -> 0.5 millisecondi

r = mt_rand(primoid,ultimoid)

select ... id = r

e in modi similari ( > , offset, ecc)

**alemoppo** · 10-08-2014, 22.53.05

Originalmente inviato da FormularioDiDrakensang

@ale

quel codice non è sbagliato di per se ma diventa quasi impossibile eseguirlo

in termini di tempo

mentre la stessa cosa si puo' fare in 0.1 -> 0.5 millisecondi

Se fosse un solo dato da estrarre, ok: creare una colonna di numeri random, ordinar tutta la tabella per questa colonna ed estrarre soltanto il primo numero, riconosco che sia un gran spreco. Ma nel suo caso immagino volesse estrarre tutti i dati (altrimenti il while() non avrebbe senso), e se si vogliono estrarre tutti i dati (appunto la limit non ha senso), secondo me quella query è corretta.

Per il discorso javascript, anche io farei senza javascript e poi al più una versione con le varie animazioni e ajax per non ricaricare la pagina: la parte lato server (php) rimane circa identica, quindi magari sarà un lavoro da fare successivamente. Lascerei comunque tutti i form per rendere compatibile la pagina con chi non ha javascript attivato (o non lo supporta proprio), disattivandoli tramite javascript in caso di supporto di tale linguaggio (ritornare false all'evendo onsubmit).

Ciao!

**castellinascalogrest** · 11-08-2014, 00.17.00

Mi sono un po' perso (sarà anche l'ora XD)

Quello che ho scritto (a parte il limit) va bene, giusto?

Ora devo fare la sessione, ma dove devo far iniziare la sessione? All'inizio dello script, dopo aver scelto a random tutto o dopo il passaggio zero?

Codice PHP:


<?php
 $username="";
 $password="";
 $database="";
 
 mysql_connect(localhost,$username,$password);
 @mysql_select_db($database) or die("Impossibile selezionare il database");
 $query="SELECT * FROM quiz ORDER BY RAND()";
 $risultati=mysql_query($query);
 $num=mysql_numrows($risultati);
 
 mysql_close();


     $i=0;
     while ($i < $num) {
         $esatta=mysql_result($risultati,$i,"esatta");
         $indizio1=mysql_result($risultati,$i,"indizio1");
         $indizio2=mysql_result($risultati,$i,"indizio2");
          $indizio3=mysql_result($risultati,$i,"indizio3");
           $indizio4=mysql_result($risultati,$i,"indizio4");

if ($_POST[passaggi]=='zero')
{
  print '<center>Ecco il primo indizio (quando) e le tre possibilit&agrave;! Se indovinerai giadagnerai 5 galeoni!<br><br><hr><br><i> 1 Indizio: Quando</i><br><br><b>';
    print $indizio1;
    print ' </b><br><br><hr><br>  Risposta 1  <input type="text" name="risposta1" value="" /><br><br>
       Risposta 2  <input type="text" name="risposta2" value="" /><br><br>
        Risposta 3  <input type="text" name="risposta3" value="" /><br><br>
<input type="hidden" name="passaggi" value="primo"><br/>
    <input type="submit" name="Submit" value="Invia" /><br><br><br>';
 }

    if ($_POST[passaggi]=='primo')
    {

if ($returnValue = strtoupper($_POST['risposta1']) == $esatta || $returnValue = strtoupper($_POST['risposta2']) == $esatta || $returnValue = strtoupper($_POST['risposta3']) == $esatta) 
{ 
   print '<br><br><center><font color="green">Risposta Esatta. Hai guadagnato 5 punti!</font></center> ' ;
 }
else 

{ 
   print ' <center> <b><font color="red">Risposta Sbagliata. Ritenta con un nuovo indizio!</font>
   </b><br><br>Ecco il secondo indizio (dove) e le due possibilit&agrave;! Se indovinerai giadagnerai 3 galeoni!<br><br><hr>
   <br><i> 1 Indizio: Quando</i><br><br><b>';
    print $indizio1;
    print '</b><br><br>  <hr><br><i> 2 Indizio: Dove</i><br><br><b>';
      print $indizio2;
      print '$</b><br><br><hr><br><br>
      Risposta 4:    <input name="risposta4" required="" type="text"><br><br>
Risposta 5:    <input name="risposta5" required="" type="text"><br><br>
 <input type="hidden" name="passaggi" value="secondo"><br/>
 <input type="submit" name="Submit" value="Invia" /><br><br><br>';

Intanto cerco una guida per vedere di schiarirmi le idee

**castellinascalogrest** · 11-08-2014, 23.08.13

Io avrei scritto questo, ma penso di aver sbagliato...

<?php

session_start();

$username="XXX";
$password="XXX";
$database="XXX";

mysql_connect(localhost,$username,$password);
@mysql_select_db($database) or die("Impossibile selezionare il database");
$query="SELECT * FROM quiz ORDER BY RAND() LIMIT 1";
$risultati=mysql_query($query);
$num=mysql_numrows($risultati);

mysql_close();

$i=0;
while ($i < $num) {
$id=mysql_result($risultati,$i,"id");
$esatta=mysql_result($risultati,$i,"esatta");
$indizio1=mysql_result($risultati,$i,"indizio1");
$indizio2=mysql_result($risultati,$i,"indizio2");
$indizio3=mysql_result($risultati,$i,"indizio3");
$indizio4=mysql_result($risultati,$i,"indizio4");

$_SESSION['id']=$id;
$_SESSION['esatta']=$esatta;
$_SESSION['indizio1']=$indizio1;
$_SESSION['indizio2']=$indizio2;
$_SESSION['indizio3']=$indizio3;
$_SESSION['indizio4']=$indizio4;

if ($_POST[passaggi]=='zero')
{
session_start();
print '<center>Ecco il primo indizio (quando) e le tre possibilità! Se indovinerai giadagnerai 5 galeoni!<br><br><hr><br><i> 1 Indizio: Quando</i><br><br><b>';
print $indizio1=$_SESSION["indizio1"];
print ' </b><br><br><hr><br> Risposta 1 <input type="text" name="risposta1" value="" /><br><br>
Risposta 2 <input type="text" name="risposta2" value="" /><br><br>
Risposta 3 <input type="text" name="risposta3" value="" /><br><br>

<input type="hidden" name="passaggi" value="primo"><br/>
<input type="submit" name="Submit" value="Invia" /><br><br><br>';

}

if ($_POST[passaggi]=='primo')
{

if ($returnValue = strtoupper($_POST['risposta1']) == $esatta=$_SESSION["esatta"] || $returnValue = strtoupper($_POST['risposta2']) == $esatta=$_SESSION["esatta"] || $returnValue = strtoupper($_POST['risposta3']) == $esatta=$_SESSION["esatta"])
{
print '<br><br><center><font color="green">Risposta Esatta. Hai guadagnato 5 punti!</font></center> ' ;

}
else
{
print ' <center> <b><font color="red">Risposta Sbagliata. Ritenta con un nuovo indizio!</font>
</b><br><br>Ecco il secondo indizio (dove) e le due possibilità! Se indovinerai giadagnerai 3 galeoni!<br><br><hr>
<br><i> 1 Indizio: Quando</i><br><br><b>';
print $indizio1=$_SESSION["indizio1"];
print '</b><br><br> <hr><br><i> 2 Indizio: Dove</i><br><br><b>';
print $indizio2=$_SESSION["indizio2"];
print '</b><br><br><hr><br><br>
Risposta 4: <input name="risposta4" required="" type="text"><br><br>
Risposta 5: <input name="risposta5" required="" type="text"><br><br>
<input type="hidden" name="passaggi" value="secondo"><br/>
<input type="submit" name="Submit" value="Invia" /><br><br><br> ';

}

}

[...]

Ho questi due problemi:
- limit1 l'ho rimesso perché se lo metto mi mostra solo un di altrimenti me li visualizza tutti_ come faccio a mantenere sempre lo stesso id ad ogni passaggio?
- non ho ben capito quando far iniziare la sessione e che parametri utilizzare perchè mi cambia ogni volta che clicco e aggiorno la pagina per dare, in caso di risposta sbagliata, un nuovo idizio

**castellinascalogrest** · 12-08-2014, 19.08.19

Mi sta venendo il dubbio che il problema sia a monte XD vi espongo i miei dubbi con un riassuntino

Allora volevo creare un quiz dove attraverso una serie di indizi una persona deve trovare una parola (tipo reazione a catena dove quando come perche).

Ho fatto un file HTML dove vengono spiegate le regole del gioco e tramite un pulsante

mi porta alla pagina PHP prova0

All'inizio sembra funzionare perchè mostra il primo indizio (A1), il campo dove inserire la parole e il pulsante per inviare. Ma quando si clicca e si ricarica la pagina ci si ritrova con gli indizi di un altro id (B1 e B2).

Questo è il codice PHP:

<center>
<form id="primo" name="passaggi" method="post" action="prova0.php">
<form id="secondo" name="passaggi" method="post" action="prova0.php">
<form id="terzo" name="passaggi" method="post" action="prova0.php">
<form id="quarto" name="passaggi" method="post" action="prova0.php">

<?php
session_start();
$username="XXX";
$password="XXX";
$database="XXX";

mysql_connect(localhost,$username,$password);
@mysql_select_db($database) or die("Impossibile selezionare il database");
$query="SELECT * FROM quiz ORDER BY RAND() limit 1";
$risultati=mysql_query($query);
$num=mysql_numrows($risultati);
mysql_close();

$i=0;
while ($i < $num) {

$id=mysql_result($risultati,$i,"id");

$esatta=mysql_result($risultati,$i,"esatta");
$indizio1=mysql_result($risultati,$i,"indizio1");
$indizio2=mysql_result($risultati,$i,"indizio2");
$indizio3=mysql_result($risultati,$i,"indizio3");
$indizio4=mysql_result($risultati,$i,"indizio4");

$_SESSION['id']=$id;
$_SESSION['esatta']=$esatta;
$_SESSION['indizio1']=$indizio1;
$_SESSION['indizio2']=$indizio2;
$_SESSION['indizio3']=$indizio3;
$_SESSION['indizio4']=$indizio4;
?>
<?php

if ($_POST[passaggi]=='zero')
{
print '<center>Ecco il primo indizio (quando) e le tre possibilità! Se indovinerai giadagnerai 5 galeoni!<br><br><hr><br><i> 1 Indizio: Quando</i><br><br><b>';
print $_SESSION['indizio1'];
print ' </b><br><br><hr><br> Risposta 1 <input type="text" name="risposta1" value="" /><br><br>
Risposta 2 <input type="text" name="risposta2" value="" /><br><br>
Risposta 3 <input type="text" name="risposta3" value="" /><br><br>
<input type="hidden" name="passaggi" value="primo"><br/>
<input type="submit" name="Submit" value="Invia" /><br><br><br>';

}

if ($_POST[passaggi]=='primo')

{
if ($returnValue = strtoupper($_POST['risposta1']) == $_SESSION["esatta"] || $returnValue = strtoupper($_POST['risposta2']) == $_SESSION["esatta"] || $returnValue = strtoupper($_POST['risposta3']) == $_SESSION["esatta"])
{
print '<br><br><center><font color="green">Risposta Esatta. Hai guadagnato 5 punti!</font></center> ' ;
}
else
{
print ' <center> <b><font color="red">Risposta Sbagliata. Ritenta con un nuovo indizio!</font>
</b><br><br>Ecco il secondo indizio (dove) e le due possibilità! Se indovinerai giadagnerai 3 galeoni!<br><br><hr>
<br><i> 1 Indizio: Quando</i><br><br><b>';
print $_SESSION['indizio1'];
print '</b><br><br> <hr><br><i> 2 Indizio: Dove</i><br><br><b>';
print $_SESSION['indizio2'];
print '</b><br><br><hr><br><br>
Risposta 4: <input name="risposta4" required="" type="text"><br><br>
Risposta 5: <input name="risposta5" required="" type="text"><br><br>
<input type="hidden" name="passaggi" value="secondo"><br/>
<input type="submit" name="Submit" value="Invia" /><br><br><br>';

}
}

if ($_POST[passaggi]=='secondo')

[...]

Penso che ricaricando la pagina dal pulsante mi selezioni un altro select, che mi va a sostituire tutto quello presistente. Io naturalmente voglio che mi mostri la stessa parola e gli indizi collegati fino alla fine del quiz.

Cosa posso modificare? Sbaglio qualcosa nel metodo post o nella sessione?

Grazie ^^

**NLSweb** · 14-08-2014, 15.53.48

Ho modificato il mio esempio , prelevando i dati dal DB con AJAX PHP , in questa piccola DEMO ho inserito solo due domande nel gioco.

Ecco come ho modificato lo script
sostanzialmente ogni qual volta si debbe generare la domanda viene eseguito tramite AJAX un file PHP che preleva la domanda
e allo stesso modo , prelevo risposta ed indizi accedendo ai file PHP relativi.
il parametro che viene passato al PHP è ID del campo del DB
chiaramente anche ID può essere generato random o con un qualsivoglia criterio ...

Codice:

<script>
$(document).ready(function(){
  
  var numeroMAXdomande = 2;
  var indiceDomende = 1;
  var domandaQuiz = "";
  var rispostaQuiz = "";
  var indizioQuiz = "";
  
  var matrice = new Array(numeroMAXdomande);
  for(i=0;i<numeroMAXdomande;i++){
   matrice[i] = 0;
  }
  
  creaDomanda(indiceDomende);
  
  $("#finestra .pulsante").click(function(){
   loadXMLDoc(indiceDomende,2);
  });
  
  /* -------- funzioni ------------- */
  
  function creaDomanda(id){
   loadXMLDoc(id,0);
   $("#finestra .pulsante").html("Invia Risposta");
  }
  
  
  function controllaRisposta(id,risp){
   var rispostaUtente = $("#risposta1").val(); 

   rispostaQuiz = rispostaQuiz.toLowerCase();
   rispostaUtente = rispostaUtente.toLowerCase();
   
   switch(risp){
    case 0:/* primo temtativo */
    
    if(rispostaUtente===rispostaQuiz){
        rispostaCorretta();   
    }else{
        primaDomanda();
    }
    
    break;
    case 1:/* secondo tentativo */
    
    if(rispostaUtente===rispostaQuiz){
       rispostaCorretta();
    }else{
       secondaDomanda();
    }
       
    break;
    case 2:/* terzo tentativo */
    
    if(rispostaUtente===rispostaQuiz){
       rispostaCorretta();
    }else{
       terzaDomanda();
    }
    
    break;
   }
  } 
  
  function vittoria(){
      var controllo = 0;
      for(i=0;i<numeroMAXdomande;i++){
       controllo += matrice[i];
      }
      
      $("#finestra h2").html("Risposte Corrette "+controllo+" di "+numeroMAXdomande);
      $("#finestra h3").html("");
      $("#risposta1").val("");
      $("#finestra .pulsante").off();
     
      $("#finestra .pulsante").click(function(){
       indiceDomende = 1; 
       creaDomanda(indiceDomende);
       $("#risposta1").toggle();
       $("#finestra h2").html("");
       $("#finestra .pulsante").off();
       $("#finestra .pulsante").click(function(){
        loadXMLDoc(indiceDomende,2);
       });
      });
     
      $("#finestra .pulsante").html("Gioca di Nuovo");
      $("#finestra h1").html("");
      $("#risposta1").toggle();
      for(i=0;i<numeroMAXdomande;i++){
       matrice[i] = 0;
      }
  }

  
  function primaDomanda(){
     $("#finestra h2").html("Risposta Sbagliata , prova di nuovo ..");
     $("#finestra .pulsante").off();
     $("#risposta1").val("")
     $("#finestra .pulsante").click(function(){
      controllaRisposta(indiceDomende,1);
     });
  }
  
  function secondaDomanda(){
     $("#finestra h2").html("Risposta Sbagliata , suggerimento ..");
     loadXMLDoc(indiceDomende,1);
  }
  
  function terzaDomanda(){
     indiceDomende ++;
     if(indiceDomende<=numeroMAXdomande){
      $("#finestra h1").html("");
      $("#finestra h2").html("Risposta Sbagliata , Prossima Domanda.");
      $("#finestra h3").html("");
      $("#risposta1").val("");
      $("#finestra .pulsante").html("Avanti");
      $("#finestra .pulsante").off();
      $("#risposta1").toggle();
    
      $("#finestra .pulsante").click(function(){     
       creaDomanda(indiceDomende);
       $("#risposta1").toggle();
        $("#finestra h2").html("");
       $("#finestra .pulsante").off();
       $("#finestra .pulsante").click(function(){
        loadXMLDoc(indiceDomende,2);
       });
      });
    
     }else{
      vittoria();
     }
  }
  
  function rispostaCorretta(){
     $("#finestra h2").html("Risposta Corretta !");
     matrice[indiceDomende-1] = 1;
     indiceDomende++; 
     if(indiceDomende<=numeroMAXdomande){
      $("#finestra .pulsante").html("Domanda Successiva");
      $("#finestra .pulsante").off();   
      $("#finestra .pulsante").click(function(){    
       $("#risposta1").val("");  
       $("#finestra h2").html("");
       $("#finestra h3").html("");
       creaDomanda(indiceDomende);
       $("#finestra .pulsante").off(); 
       $("#finestra .pulsante").click(function(){
        loadXMLDoc(indiceDomende,2);
       });
      });
     }else{
      vittoria();
     }
  }


function loadXMLDoc(id,Query)
{
var xmlhttp;
if (window.XMLHttpRequest)
  {
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
   
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
     var risultato = xmlhttp.responseText;
     switch(Query){
      case 0:
       domandaQuiz = risultato;
       $("#finestra h1").html(domandaQuiz);
      break;
      case 1:
       indizioQuiz = risultato;
       $("#finestra h3").html(indizioQuiz);
       $("#risposta1").val("");
       $("#finestra .pulsante").off();
       $("#finestra .pulsante").click(function(){
        controllaRisposta(indiceDomende,2);
       });
      break;
      case 2:
       rispostaQuiz = risultato;
       var n = rispostaQuiz.length;
       n--;
       rispostaQuiz = rispostaQuiz.substr(0, n);
       controllaRisposta(indiceDomende,0);
      break;
     }
    }
  }
switch(Query){
 case 0:
  xmlhttp.open("GET","domanda.php?ID="+id,true); 
 break;
 case 1:
  xmlhttp.open("GET","indizio.php?ID="+id,true); 
 break;
 case 2:
  xmlhttp.open("GET","risposta.php?ID="+id,true); 
 break;
}
xmlhttp.send();  
}

});

i file PHP hanno tutti la stessa struttura , cambia solo il dato da prelevare

Codice PHP:


<?php
$con=mysqli_connect("...","...","...","...");
if (mysqli_connect_errno()) {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$ID = $_GET['ID'];
$query = "SELECT * FROM `quiz` WHERE `ID`=$ID";

$result = mysqli_query($con,$query) or die(mysql_error()); 

while($row = mysqli_fetch_array($result)) {
 $controllo = $row['ID'];
 if ($controllo==$ID){
  $domanda = $row['domanda'];
 }
}
 
echo $domanda;

mysqli_close($con);
?>

Discussione: Creare un quiz

LinkBack

Strumenti discussione

Display

Creare un quiz

Regole di scrittura