Faire apparaitre des radio bouton aléatoirement

Résolu/Fermé
techenherb Messages postés 37 Date d'inscription dimanche 5 juillet 2015 Statut Membre Dernière intervention 3 juillet 2020 - Modifié le 14 févr. 2020 à 12:55
techenherb Messages postés 37 Date d'inscription dimanche 5 juillet 2015 Statut Membre Dernière intervention 3 juillet 2020 - 15 févr. 2020 à 09:19
Bonjour, après x recherches, je ne trouve toujours pas de réponses à mon problème.

Je souhaite faire apparaître des radio bouton dans un ordre aléatoire, mais cependant je ne trouve rien de concluant sur le net.


Merci de votre aide qui me sera précieuse.

button1
button2
button3

button3
button2
button1

ex


<input type="radio" name="question-8-answers" id="A" value=""/>
<label for="question-8-answers-A">blabla</label> <br>


<input type="radio" name="question-8-answers" id="A" value=""/>
<label for="question-8-answers-B">blabla3</label> <br>


<input type="radio" name="question-8-answers" id="A" value=""/>
<label for="question-8-answers-B">blabla2</label> <br>

A voir également:

2 réponses

jordane45 Messages postés 37253 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 mars 2023 4 551
14 févr. 2020 à 13:58
Bonjour,


Où sont stockées les données à afficher ?
Sais tu ce qu'est un array ?
As tu regardé la fonction javascript Math.random()
Qu'as tu essayé ?
0
techenherb Messages postés 37 Date d'inscription dimanche 5 juillet 2015 Statut Membre Dernière intervention 3 juillet 2020
Modifié le 14 févr. 2020 à 17:36
les données à afficher sont dans des variables en php.
Oui, je vois ce que sais,
Cette fonction, je l'ai déjà utilisé pour faire "bouger des div de manière dynamique en jquery.
Rien de bien concluant et présentable malheureusement. Je peux te donner plus de code si tu veux :

<div class="container">
                        <div>
                            <?php echo $q1; ?>
                                <input type="radio" name="question-1-answers" id="question-1-answers-A" value="<?php echo $pr1A; ?>" />
                                <label for="question-1-answers-A"><?php echo $pr1A; ?></label> <br>

                            
                                <input type="radio" name="question-1-answers" id="question-1-answers-B" value="<?php echo $pr1B; ?>" />
                                <label for="question-1-answers-B"><?php echo $pr1B; ?></label> <br>
                            
                                <input type="radio" name="question-1-answers" id="question-1-answers-C" value="<?php echo $r1; ?>" />
                                <label for="question-1-answers-C"><?php echo $r1; ?></label> <br>

                            
                                <input type="radio" name="question-1-answers" id="question-1-answers-D" value="<?php echo $pr1D; ?>" />
                                <label for="question-1-answers-D"><?php echo $pr1D; ?></label> <br>
                        </div>    
                        <div>
                            <?php echo $q2; ?>
                                <p> Réponse : <input type="text" id="question-2-answers" minlength="5" maxlength="15" name="question-2-answers" size="15"> </p> <br>
                        </div>                                 
                        <div>
                            <?php echo $q3; ?>
                                <input type="radio" name="question-3-answers" id="question-3-answers-A" value="<?php echo $pr3A; ?>" />
                                <label for="question-3-answers-A"><?php echo $pr3A; ?></label> <br>
                            
                                <input type="radio" name="question-3-answers" id="question-3-answers-B" value="<?php echo $r3; ?>" />
                                <label for="question-3-answers-B"><?php echo $r3; ?></label> <br>
                            
                                <input type="radio" name="question-3-answers" id="question-3-answers-C" value="<?php echo $pr3C; ?>" />
                                <label for="question-3-answers-C"><?php echo $pr3C; ?></label> <br>
                            
                                <input type="radio" name="question-3-answers" id="question-3-answers-D" value="<?php echo $pr3D; ?>" />
                                <label for="question-3-answers-D"><?php echo $pr3D; ?></label> <br>
                        </div>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> // permet de pouvoir inclure un fichier permettant d'exec le js VERSION :   mai 2019 </script>  
   <script type="text/javascript">
    $(document).ready(function(){
        var collection = $("div.container div").get();
        collection.sort(function() {
            return Math.random()*10 > 5 ? 1 : -1;
        });
        $.each(collection,function(i,el) {
            $(el).appendTo( $(el).parent() );
        });
    });
    </script>

0
jordane45 Messages postés 37253 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 mars 2023 4 551
14 févr. 2020 à 18:11
Tes questions / réponses sont dans des variables PHP ?
Tu veux "randomizer" les questions et les réponses ? que les questions ? que les réponses ?

Tu les as initialisé comment ? Elles ne viennent pas d'une BDD sql ?

Si tu elles sont dans une bdd ... dans ce cas, tu peux faire du random directement dans ta requête sql.

Si elles sont juste dans des variables php ..... stocke les, plutot, dans un array.
Il te sera alors facile d'utiliser les fonctions php ( au choix) shuffle ou array_rand, et tu n'auras plus qu'à afficher tes questions à l'aide de boucle foreach sur ton array.
0
techenherb Messages postés 37 Date d'inscription dimanche 5 juillet 2015 Statut Membre Dernière intervention 3 juillet 2020 > jordane45 Messages postés 37253 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 mars 2023
Modifié le 15 févr. 2020 à 09:20
C'est bon j'ai trouvé !
j'ai procédé autrement :
pour afficher de manière aléatoire le choix multiple

        <form action="grade.php" method="post" id="quiz">
                <ol>
                    <div class="container">
                        <?php 
                    
            
                        for ($i = 1; $i <= $nbQuestions ; $i++) {
                            echo "<div>";
                            echo ${'q'.$i};
                            if (isset(${'pr'.$i.'A'})) {
                                echo "<input type=\"radio\" name=\"question-".$i."-answers\" id=\"question-".$i."-answers-A\" value=\"${'pr'.$i.'A'}\" />
                                <label for=\"question-".$i."-answers-A\">${'pr'.$i.'A'}</label> <br>";
                            }
                            if (isset(${'pr'.$i.'B'})) {
                                echo "<input type=\"radio\" name=\"question-".$i."-answers\" id=\"question-".$i."-answers-B\" value=\"${'pr'.$i.'B'}\" />
                                <label for=\"question-".$i."-answers-B\">${'pr'.$i.'B'}</label> <br>";
                            }
                            if (isset(${'pr'.$i.'C'})) {
                                echo "<input type=\"radio\" name=\"question-".$i."-answers\" id=\"question-".$i."-answers-C\" value=\"${'pr'.$i.'C'}\" />
                                <label for=\"question-".$i."-answers-C\">${'pr'.$i.'C'}</label> <br>";
                            }
                            if (isset(${'pr'.$i.'D'})) {
                                echo "<input type=\"radio\" name=\"question-".$i."-answers\" id=\"question-".$i."-answers-D\" value=\"${'pr'.$i.'D'}\" />
                                <label for=\"question-".$i."-answers-D\">${'pr'.$i.'D'}</label> <br>";
                            }
                            if (isset(${'r'.$i})) {
                                echo "<input type=\"radio\" name=\"question-".$i."-answers\" id=\"question-".$i."-answers-D\" value=\"${'r'.$i}\" />
                                <label for=\"question-".$i."-answers-D\">${'r'.$i}</label> <br>";  
                            }
                            echo "</div>";
                        } ?>
               
                        </ol>
                    <div>
                        <p> Email *  : <input type="email" id="email" name="email" required size="15"> </p>
                        <p> Nom :<input type="text" id="name" name="name"  size="15"> </p>
                        <p> Âge :<input type="number" id="age" name="age"  size="15"> </p>
                        <p> <i> le champ avec un astérisque * est requis afin que je puisse vous envoyer la correction </i> <p>
                        <input type="submit" value="Submit Quiz" />
        </form>
      
    </body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> // permet de pouvoir inclure un fichier permettant d'exec le js VERSION :   mai 2019 </script> 
    <script type="text/javascript">
    $(document).ready(function(){
        var collection = $("div.container div").get();
        collection.sort(function() {
            return Math.random()*10 > 5 ? 1 : -1;
        });
        $.each(collection,function(i,el) {
            $(el).appendTo( $(el).parent() );
        });
    });
    </script>
0