[Résolu] Calcul en PHP par leaston - page 1

Bonjour à tous,

J'ai essaye de créer un (petit) code qui ne me semble plus petit.

L'idée est d'avoir 2 input qui puissent recevoir chacun 1 nombre aléatoire. Un troisième input permet de recevoir la réponse (l'addition des nombres aléatoire des champs précédents). Si la réponse est correcte, on donne la note de 1 sur 4 (question par exemple à poser). Après la réponse à la première question, on passe à la deuxième, puis à la troisième pour finir par la quatrième et dernière question. Je n'arrive pas à boucler.

Aussi, à chaque question posée, un décompte en seconde est aussi généré aléatoirement (entre 100 et 0) de sorte qu'à zéro la question en cours ne soit plus valide. Je n'arrive pas à stopper (en JavaScript).

Quelqu'un peut-il me venir en aide? Merci

Mon code :

<?php
ini_set('display_errors',1);

	
	$firstNumber = rand(1, 10);								
	$secundNumber = rand(2, 10);
	
	
?>

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

    <title>The Lab</title>
  </head>
  <body>
    <h1>&nbsp;</h1>
	<div class="container">&nbsp;
		<div class="row fw-bold text-light bg-info border border-5 rounded-3" style="margin-top: -23px;" align="center">
			<div class="col">
			  <?php 
				$thedate = date('Y-m-d H:i:s');
				echo $thedate;
			  ?>
			</div>
			<div align="center" class="col">
				<h3>||&nbsp;Math Lab App&nbsp;||</h3>
			</div>
			<div align="left" class="col">
			  <div class="row" align="right">
				<div class="col-6" align="right">Time remaining : </div>
				<div id="timer" class="col-6" align="left"></div>
				</div>
				<script>
					const titre = document.querySelector('.titre');
					const random = (max,min) => {
						return Math.floor(Math.random() * (max - min + 1) + min);
					}
					
				  let temps = random(100, 20);
				  const timerElement = document.getElementById("timer")

				  function diminuerTemps() {
						let minutes = parseInt(temps / 60, 10)
						let secondes = parseInt(temps % 60, 10)
						minutes = minutes < 10 ? "0" + minutes : minutes
						secondes = secondes < 10 ? "0" + secondes : secondes
						timerElement.innerText = temps
						temps--
				  }

				  setInterval(diminuerTemps, 1000)
				</script>
			</div>
		</div>
		<div class="row">
			<div class="col">
			  <img src="img/img11p.jpg" align="left" width="100%" height="100%" alt="Study Mathematics" />
			</div>
			<div class="col shadow-lg p-3 mb-5 bg-body border border-3 rounded rounded-3">
				<form action="" method="post">
					<fieldset >
						<table align="center" width="100%" class="table table-dark table-hover rounded">
						  <thead>
							<tr align="center">
							  <td colspan="4" scope="col">
								  <h3></h3>
							  </td>
							</tr>
						  </thead>
						  <tbody>
							<tr>
							  <td colspan="4" align="center" scope="row">
								<input class="rounded-pill w-80 p-3 h-80 d-inline-block" id="nb1" name="nb1" autocomplete="off" style="width: 40%; font-weight: bolder;" value="<?php echo $firstNumber ;?>" /> +
								<input class="rounded-pill w-80 p-3 h-80 d-inline-block" id="nb2" name="nb2" autocomplete="off" style="width: 40%; font-weight: bolder;" value="<?php echo $secundNumber  ;?>" />
							  </td>
							</tr>
							<tr>
								<td align="center" colspan="4"  scope="row">
									<input class="rounded-pill w-80 p-3 h-80 d-inline-block" id="response" name="response" placeholder="Give your answer" autocomplete="off" style="width: 80%; font-weight: bolder;" />
								</td> 
							</tr>
							<tr>
							  <td colspan="4"  scope="row">
							 &nbsp;
							  </td>
							</tr>
							<tr>
							  <td colspan="2"  scope="row">
								<input id="submit" name="submit" type="submit" value="Want to restart" class="btn btn-primary" style="margin-left: 20px;" />
							  </td>
							  <td align="right" colspan="2"  scope="row" >
								<input id="reset" name="reset" type="reset" value="Clean the field" class="btn btn-warning" style="margin-right: 20px;" />
							  </td>
							</tr>
							<tr>
							  <td colspan="4"  scope="row">&nbsp;</td>
							</tr>
							<tr>
							  <td colspan="4" align="center" scope="row" class="text-info">
								<?php
									
										$result = "";
										$_POST['nb1'];
										$_POST['nb2'];									
																			
										$summe = $_POST['nb1'] + $_POST['nb2'];		
										$response = $_POST['response'];	
										echo "<br />Response : ". $response ."<br />";
									
									if($response != $summe){
										echo $result = "Is incorrect !<br />";	
									}
									
									$note = 0;
									while($response == $summe){
										$note += 1;
										echo $result = "Well done !<br />";
										echo "Note = ". $note."<br />";
										break;
										
										if($note == 5) break;
										
									}

                                                                     }
								?>
							  </td>
							</tr>
							<tr>
							  <td colspan="4"  scope="row"></td>
							</tr>
						  </tbody>
						</table>
					</fieldset>
				</form>
			</div>
			<div class="col">
			  <img src="img/img12p.jpg" align="right" width="100%" height="100%" alt="Study Mathematics" />
			</div>
		</div>
		
		<div class="row fst-italic text-dark bg-info border border-5 rounded-3">
			<div class="col">
			  Version 1.0
			</div>
			<div align="center" class="col">
				&nbsp;
			</div>
			<div align="left" class="col">
				<div class="row">
					<div class="col-6"></div>
					<div class="col-6"></div>
				</div>
			</div>
		</div>
		
	</div>

    <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

    <!-- Option 2: Separate Popper and Bootstrap JS -->
    <!--
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
    -->
  </body>
</html>

-
Edité par leaston 9 mai 2022 à 23:07:22

leaston

9 mai 2022 à 23:03:44

monkey3d

10 mai 2022 à 8:07:53

Bonjour,

Il me semble que le forum javascript serait plus adapté pour ta question.

Ceci dit pour stopper un timer en javascript - si c'est ta question ? - il y a la méthode clearTimeout.

https://www.w3schools.com/js/js_timing.asp

A+

10 mai 2022 à 20:18:24

Bonjour monkey3d,

Pour la partie Javascript, ta réponse m'a orienté et j'ai pu régler le problème de décompte du temps. Merci beaucoup.

Il me reste la partie PHP pour faire la boucle.

julienochsenbein

11 mai 2022 à 13:00:29

Salut,

Étant donner que tu recharge ta page à chaque fois je pense que tu perd ton score et repart chaque fois de 0. Il faut stocker ton score quelque part dans ton formulaire puis le renvoyer avec le résultat

11 mai 2022 à 20:45:40

Bonjour julienochsenbein,

Merci pour ta réponse. Tu as tout à fait raison, le score est perdu après rafraichissement de la page. Je vois sans issue ce que tu me proposes. Mais ma question est comment stocker le score dans un formulaire? Peux-tu m'éclairer un peu? J'ai par contre penser à le stoker dans un petit fichier texte. Je te remercie déjà pour la suite de ta contribution.

15 mai 2022 à 11:40:45

Tu peux stocker ton score dans un input de type hidden (pas visible). Ensuite tu controle si ton formulaire à été envoyé et si la réponse est ok tu ajoute 1 à ton score:

Voici dans l'idée comment cela peut fonctionner

<?php
    if(isset($_POST['score'])){
        $result = true; //si le resultat de l'adition est juste $result vaut true sinon false
        $score = $_POST['score'];

        if($result){
            $score++ ;
        }
    }else{
        $score = 0;
    }
?>
    <form method="POST" action="" >
        <input type="hidden" name="score" value="<?php echo $score ?>" />
        <input type="submit" value="Envoyer" />

        <?php echo "Votre résultat : ". $score ?>
    </form>

17 mai 2022 à 20:02:55

Je tiens à te remercier de vive voix car grâce à tes proposition mon code marche correctement maintenant. Un exercice qui m'a permis de comprendre des choses.

Merci à tous ceux qui m'ont aidé.

Calcul en PHP

Calcul en PHP

Supprimer

Modérer

Signaler le message aux modérateurs