Liste select à partir d'un tableau

playerone - Modifié le 26 nov. 2018 à 22:21
 playerone - 26 nov. 2018 à 22:47
Bonjour tout le monde je suis entrain de créer un formulaire et je me posais la question de la balise <select> qui affiche une liste déroulante à l'écran.
Je souhaiterais que celle ci soit dynamique dans le sens où en fonction d'une variable array() chaque ligne d'option prenne la valeur d'une ligne de mon tableau.

Par exemple, un formulaire d'inscription d'enfant au collège ou au lycée.

1) on clique sur l'onglet collège ou l'onglet lycée
2) le formulaire s'affiche et ma liste classe affiche les classes en fonction de ce choix.

J'ai essayé une boucle php à l'intérieur de mon formulaire mais ça fonctionne pas j'ai du me planter dans la syntaxe

mon script
<script>
 
        function addRow(tableID) {
 
            var table = document.getElementById(tableID);
 
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
 
            var colCount = table.rows[0].cells.length;
 
            for (var i = 0; i < colCount; i++) {
 
                var newcell = row.insertCell(i);
 
                newcell.innerHTML = table.rows[1].cells[i].innerHTML;
                //alert(newcell.childNodes);
                switch (newcell.childNodes[0].type) {
                    case "text":
                        newcell.childNodes[0].value = "";
                        break;
                    case "checkbox":
                        newcell.childNodes[0].checked = false;
                        break;
                    case "select-one":
                        newcell.childNodes[0].selectedIndex = 0;
                        break;
                }
            }
        }
 
        function deleteRow(tableID) {
            try {
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;
 
                for (var i = 0; i < rowCount; i++) {
                    var row = table.rows[i];
                    var chkbox = row.cells[0].childNodes[0];
                    if (null != chkbox && true == chkbox.checked) {
                        if (rowCount <= 1) {
                            alert("On ne peut pas supprimer toutes les lignes.");
                            break;
                        }
                        table.deleteRow(i);
                        rowCount--;
                        i--;
                    }
 
 
                }
            } catch (e) {
                alert(e);
            }
        }
        function change_case(ceci)
        {
            if (ceci.checked) // checkbox COCHEE : on peut remplir
            {
                ceci.parentNode.childNodes[2].readOnly = false;
            } else { // checkbox PAS cochee
                ceci.parentNode.childNodes[2].readOnly = true; // readOnly : en lecture seule
                ceci.parentNode.childNodes[2].value = ''; // on vide
            }
        }
 
 
    </script>



<div class = "content">
        <fieldset>
            <br />
            <legend>Formulaire</legend>
            <br />
 
 
            <form name="myform" id="myform" method="post" action="./index.php?action=verif">
 
                <div class="donnees">
                    <table id="dataTable"style="background-color: transparent">
 
                        <th> Choix </th>
                        <th size="40"> Classe </th>
                        <th> nom </th>
                        <th> prénom</th>
                        <th> deuxième prénom</th>
                        <th> age</th>
                        <th > Fille/Garçon</th>
 
                        <tr >
 
                            <td width="5%" ><input type="checkbox" name="chk" /></Td>
                            <td width="25%" >
                                <select name="classe[]">
                                    <option value=""> Classe </option>
                                  // c'est ici où je bloque 
<?php
$college =  array("sixième", "cinquième", "quatrième", "troisième");
 
for($i = 0; $i < count($college);$i++)
{
  echo "<option> $college[$i] </option>";
}
?>
 
                                </select>
                            </td>
                            <td width="20%" ><input type="text" name="nom[]"  /></td>
                            <td width="20%" ><input type="text" name="prenom[]"  /></td>
                            <td width="20%" ><input type="checkbox" name="checkbox[]"  checked="checked" onclick="change_case(this);" />
 
                                <INPUT  type="text" name="deuxiemePrenom[]">
                            </td>
                            <td width="5%" ><input type="text" name="age[]" /> </td>
                            <td width="5%" ><select name="sexe[]">
                                    <option value="choix 1"> Fille </option>
                                    <option value="choix 2"> Garçon </option>
 
                                </select>
                            </td>
 
 
 
 
                        </tr>
 
                    </table>
                </div>
                </br>
                <div class = "boutons">
                    <input type="button" style = "width: 170px;left: 448px;position:absolute" class = "greenButton" value="Ajouter une ligne" onclick="addRow('dataTable')" />
                    <input type="button" style = "width: 170px;left: 248px;position:absolute" class = "redButton" value="Supprimer une ligne" onclick="deleteRow('dataTable')" />
                    <input type="submit" style = "width: 170px;left: 648px;position:absolute" value="Valider"> <br>
                </div>
                </br>
            </form>
 
 
        </fieldset>
 
    </div>



2 réponses

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 344
26 nov. 2018 à 22:26
Bonjour,

Déjà... on ne comprend pas trop le rapport (le lien...) entre ton bout de code JS et celui en php...

Ensuite, côté php.. tu as une erreur au niveau de ton echo
for($i = 0; $i < count($college);$i++)
{
  echo "<option value='" .$college[$i]."'>" .$college[$i]." </option>";
}

encore mieux :
foreach($college as $C){
  echo "<option value='".$C."'>".$C."</option>";
}


Pour ce qui est d'actualiser ta liste en fonction du "choix"... il faudrait nous dire ce que déclenche exactement le clique sur l'onglet collège ou l'onglet lycée ... (changement d'url ? variables dans l'url ? déclenchement d'un js ?? )
Si c'est uniquement le déclenchement d'un JS... dans ce cas ton php ne te servira à rien. Tu devras faire de l'ajax.
Si, par contre, ça change l'url (ou au moins une variable qui se trouve dans l'url) dans ce cas tu pourras modifier ton array sans trop de souci en fonction de la dite variable....

0
Oui pardon c'etait pas très clair j'ai envoyé mon formulaire complet mais au final je ne m'intéresse qu'à la fonction de la liste select.

En gros cliquer sur l'onglet college voudra dire dans mon code:

utiliser le tableau $college et chaque ligne de ce tableau devra être une option de ma liste.

C'est un exemple que j'ai pris pour illustrer. Je cherche à afficher une liste selon les valeurs d'un array. Dans mon vrai formulaire, en fonction d'un choix je crée un tableau qui récupère des valeurs d'une base de données et j'affiche dans ce formulaire la liste des choix correspondant
0
Rejoignez-nous