Easy-Micro


ESPACEMEMBRE PHP-MySQL
Menu déroulant

Afficher la table "clients" dans un menu déroulant

Afficher le résultat d'une requête dans un menu déroulant (select) est d'autant plus important que le nombre de résultat d'une requête SQL est souvent inconnu et parfois très long. L'objectif ici est d'afficher les prénoms et les noms de la table clients dans deux menus déroulants distinct.

Syntaxe PHP orientée Objet

Fichier PHP index-clients.php (dans le dossier clients)
Exercice réalisé en janvier 2019 avec Christian Valade du SIAE/AIA de Bordeaux
<?php
// connexions
require_once("clients/connexion.php");
$resultat = $mysqli->query("SELECT * FROM ".$table.";");
$mysqli->set_charset("utf8"); // évite les problèmes d'encodage
if (!$resultat) {
printf("Problème de requête - Erreur : %s", $mysqli->error); }
else {
?>

<!-- affiche les prénoms de la table clients dans un menu déroulant -->
<form action="index.php?page=clients/index-clients.php" method="post">
<select id="liste_prenom" onchange="syva_prenom()">

<?php
while($ligne = $resultat->fetch_array(MYSQLI_BOTH)) {
echo "<option value='".$ligne["id_client"]."'>".utf8_encode($ligne["prenom_client"])."</option>";
}
$resultat->data_seek(0); // remise à zéro du pointeur
?>

</select>

<!-- Deuxième select pour les noms des clients -->
<select id="liste_nom" onchange="syva_nom()">

<?php
while($ligne2 = $resultat->fetch_array(MYSQLI_BOTH)) {
echo "<option value='".$ligne2["id_client"]."'>".$ligne2["nom_client"]."</option>";
}

$resultat->close(); // libère les résultats
?>

</select>
<input type="text" name="id" id="id" readonly="true" style="width:25px;">
<input type="text" name="zonemodif" id="zonemodif" style="width:120px;">
<input type="hidden" name="choix_update" id="choix_update">
<input type="submit" value="Actualiser">
</form>

<?php
// On récupère les POST
if(isset($_POST['zonemodif']) && isset($_POST['id'])) {
$zonemodif = $_POST['zonemodif'];
$id_client = $_POST['id'];
$choix_update = $_POST['choix_update'];

// requête de type UPDATE
$resultat = $mysqli->query("UPDATE ".$table." SET ".$choix_update." ='".$zonemodif."' WHERE id_client='".$id_client."';");

if (!$resultat) { echo "Houston?"; }
else {
header("Location: index.php?page=clients/index-clients.php");
}
}

$mysqli->close(); // ferme la connexion

}
?>

Code du fichier connexion.php appelé dans le require_once du fichier index-clients.php
<?php
// connexion clients

$base = "mabase";
$serveur = "127.0.0.1";
$user = "root";
$pass = "";
$table ="clients";

// on instancie la classe mysqli (en syntaxe orientée objet)
$mysqli = new mysqli($serveur, $user, $pass, $base);

// appel de méthode avec l'opérateur ->
if ($mysqli->connect_errno) {
printf("Échec de la connexion : %s", $mysqli->connect_error); // %s pour string
exit();
}

?>

Code Javascript à rajouter dans le fichier index-clients.php
Ce code est exécuté suite au onchange du select :
<script>
function syva_prenom() {
// Fait passer les prénoms des clients dans le champ de modification
document.getElementById('zonemodif').value = document.getElementById('liste_prenom').options[document.getElementById('liste_prenom').selectedIndex].text;

// Fait passer l'id correspondant aux prénoms dans le champ id
document.getElementById('id').value = document.getElementById('liste_prenom').value;

// Initialise le choix du prénom de la colonne de la table client dans un champ caché (hidden) pour initialiser le SET de la requête sur le prénom ou le nom car nous n'avons q'un seul champ de modification
document.getElementById('choix_update').value = "prenom_client";
}

// Deuxième fonction identique à l'autre mais pour les noms
function syva_nom() {
// Fait passer les noms des clients dans le champ de modification
document.getElementById('zonemodif').value = document.getElementById('liste_nom').options[document.getElementById('liste_nom').selectedIndex].text;

// Fait passer l'id correspondant aux noms dans le champ id
document.getElementById('id').value = document.getElementById('liste_nom').value;

// Initialise le choix du nom de la colonne de la table client dans un champ caché (hidden)
document.getElementById('choix_update').value = "nom_client";
}

</script>


Lier les deux listes déroulantes

Pour lier deux listes déroulante entre elle, on utilise idéalement la librairie jquery.chained.js. Exemple sur deux listes déroulante avec les prénoms et les noms d'une unique table Mysql Clients.

// Appel des librairies Jquery :
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/jquery.chained.js"></script>

// Script Jquery de chainage de liste
<script>
$(function(){
$("#liste_nom").chained("#liste_prenom");
});
</script>

Rajoutez enfin une classe dans le while d'affichage des noms : class='".$ligne2["id_client"]."'

Exemple complet du while avec la class id_client (syntaxe PHP objet) :
while($ligne = $resultat->fetch_array(MYSQLI_BOTH)) {
echo "<option value='".$ligne["id_client"]."' class='".$ligne["id_client"]."'>".$ligne["nom_client"]."</option>";
}



Syntaxe PHP procédurale

<?php
$base = "mabase";
$user = "root";
$pass = "mysql";
$serveur = "localhost";
// ATTENTION: suivant votre version, le mot de passe du serveur MySQL est soit vide, soit 'mysql'.

mysql_connect($serveur,$user,$pass)
or die("Connexion impossible: ".mysql_error());
mysql_select_db($base);
$requete = "SELECT nom FROM clients";
$resultat = mysql_query($requete);
if (!$resultat) { echo "<html><body>Problème de requête</body></html>"; }
else {
?>
<html>
<body>

<form method="post" name="monformulaire" action="traitement_modif.php">
Nom des clients :
<select name="nom">
<option value="choix">Choisir un nom</option>
<?php
// Affichage du contenu de la table "clients"
while($ligne = mysql_fetch_array($resultat)) {
echo "<option value='".$ligne['nom']."'>".$ligne['nom']."</option>";
}
// remet le pointeur du mysql_fetch_array à 0 (facultatif mais nécessaire si plusieurs mysql_fetch_array)
mysql_data_seek($resultat,0);
?>
</select>
</form>

</body>
</html>
<?php } // fin du else
?>


Cas de formulaire avec méthode GET (method="GET")

Le fichier traitement_modif.php :
<?php
// On récupère le champ du select par un GET (car method GET sur le formulaire)
if (isset($_GET['noms'])) { $noms = $_GET['noms']; }

// redirection vers affichage avec envoie du nom du client
header("Location: index.php?page=clients&lenom=".$noms);
?>

La page qui affiche la table récupère le nom via un GET et fait une requête avec la valeur de ce GET comme ceci (Contenu du fichier affichage_table.php) :
<?php
if (isset($_GET['lenom'])) {
$requete = "SELECT * FROM clients WHERE nom_client = ".$_GET['lenom'].";
}
else {
$requete = "SELECT * FROM clients";
}

... patali, patala...
?>

Note : si vous voulez que votre menu déroulant ce déclenche automatiquement, rajoutez un onChange dans votre balise SELECT comme ceci : onchange="this.form.submit();"


Suivez les aventures des skippers aquitains sur EasyVoile.com
Flux RSS Easy-Micro - Abonnez-vous Easy-Micro [ François Bisch ]
Dimanche 15 septembre 2019 - Semaine 37 - Saint Roland (Demain: Sainte Edith)
Aujourd'hui, c'est l'anniversaire de Tommy Lee Jones (1946-73 ans), acteur et réalisateur américain (Le Fugitif, Entre Ciel et Terre, Men in Black...). Autre 15 septembre: 1997 - Enregistrement du nom de domaine "google.com".
Haut de page Easy-Micro