Développement web
PHP
MySQL
HTML
Javascript
il y a 2 ans citizenz7 0 commentaire 3042 lectures
A près quelques recherches, j'ai trouvé le plugin Jquery qui s'appelle Chained (https://github.com/tuupola/jquery_chained).
A une époque où Jquery n'a plus la quotte et où il est progressivement "abandonné" (cf Bootstrap 5), je me suis résigné, pauvre mortel, à quand même l'utiliser. Ca m'arrange bien, car je suis une grosse bille en JS.
Il y certainement moyen d'utiliser du JS vanilla pour faire la même chose. Si vous avez une idée, n'hésitez pas à laisser un mot, je suis preneur.
Voici donc mon exemple ci-dessous. J'ai commenté le code.
Issus de la même table, les champs code et nom sont reliés par l'ID.
<html>
../..
<body>
../..
<div class="col-sm-2">
<label for="codestructure">1/ Code structure :</label>
<select id="codestructure" name="codestructure" class="form-control mb-3">
<option value="">---</option>
<?php
// On recherche tous les codes des structure qu'on va afficher dans un <select>
$codes = $db->query('SELECT id, code FROM structures ORDER BY id ASC');
foreach ($codes as $code) {
?>
<option value="<?php echo $code['code']; ?>"><?php echo $code['code']; ?></option>
<?php
}
?>
</select>
</div>
<div class="col-sm-4"> <label for="structure">2/ Structures :</label>
<select id="structure" name="structure" class="form-control mb-3">
<?php
// On recherche tous les noms des structures
// Grace à Jquery chained, cette partie ne s'affichera que si on sélectionne un code préalablement
// ... et tout fonctionne grâce à l'id "structure" ici et l'id "codestructure" pour le select au-dessus
$strucs = $db->query('SELECT id, nom, code FROM structures ORDER BY id ASC');
foreach ($strucs as $struc) {
?>
<option class="<?php echo $struc['code']; ?>" value="<?php echo $struc['nom']; ?>"><?php echo $struc['nom']; ?></option>
<?php
}
?>
</select>
</div>
<!-- Code Jquery qui va "lier" (chained) l'id "structure" à l'id "codestructure" -->
<script type="text/javascript" charset="utf-8">
$(function() {
$("#structure").chained("#codestructure");
});
</script>
<!-- Evidemment, n'oubliez pas d'appeler Jquery (attention aux versions, toutes ne fonctionnent pas), j'ai pris ici la version avec Bootstrap qui fonctionne -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<!-- Enfin, appelez jquery.chained.js -->
<script src="https://www.appelsiini.net/download/jquery.chained.js" type="text/javascript" charset="utf-8"></script>
../..
</body>
</html>
Blog d'un geek quinqua nivernais fan d'ovalie, de linuxerie, de musique et de Net
@Venkman
Il faut ajouter un setFormType() dans configureFields() pour les cha...
citizenz7
01-07-2023
Hé bah allez, une journée d’plus en moins. On va aller dormir et pi demain on recommence. Je peux vous dire que tavernier, c’est pas une sinécure. (Le tavernier, Kaamelott, Livre I, 28 : La botte secrète)