Tom's Guide > Forum > Programmation > [Résolu] [Php] Listes déroulantes à contenu interractif

[Résolu] [Php] Listes déroulantes à contenu interractif

Forum Programmation : [Résolu] [Php] Listes déroulantes à contenu interractif

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !

Créer un nouveau sujet Répondre

Bas de page Chercher dans ce sujet

Bonjour tout le monde !
Voilà, je souhaite faire deux liste déroulantes contanant des informations provenant d'une base de données. Jusque là pas de probleme. Mais j'aimerai en plus de celà, que le contenu de la seconde liste déroulante varie en fonction de l'option choisie dans la premiere. Tout le monde me suis ?
Oki, en fait j'ai une table "catégorie" [id,nom_categorie], et une autre "fonction" [id,id_categorie,nom_fonction]. Quand je selectionne une categorie, "jeu" par exemple, la seconde m'afficherai , "aventure", "stratégie", etc ... Maintenat imaginons que je choisisse finallement la categorie "activités" dans la premiere liste, la seconde m'afficherai "sport", "distractions" etc ...

Ce systeme j'ai réussi à le mettre en place, en passant un paramettre à chaque fois mais cette technique s'avere un peu fastidieuse pour l'utilisateur : a chaque fois, il faut valider la premiere liste, pour en suite retomber sur une page qui récupère en POST la catégorie. De même on selectionne la fonction et l'on revalide pour obtenir les résultats répondants à ces deux critères.

J'aimerai donc qu'en choisissant la catégorie, la seconde liste soit immédiatement mise à jour contenant les fonctions correspondant avec la catégorie selectionnée. Ainsi il ne resterai plus qu'a selectionner la fonction et les résultats s'afficherait.

Je sais pas si j'ai bien réussi à me faire comprendre ...
Je vous montre donc ce que j'ai déjà fait : www.dream-ressources.com/telechargement.php

Merci d'avance pour l'attention prêtée à ce message!

Cordialement

Message édité par cameleon1st le 26-08-2007 à 00:21:14

Répondre

Inscrivez-vous ou connectez-vous pour masquer ceci.

Salut,

Dans ton cas, le plus simple est de faire une requête de type XMLHttpRequest.
Pour faire ça plus facilement, tu peux utiliser un framework ajax.

Il faut que tu aies une page qui te retourne toutes les différentes options pour chaque ID envoyé à cette même page.

Exemple, ta page "options.php", tu l'appelles avec l'ID 5 (options.php?id=5), elle va te retourner toutes les options que tu veux.

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

bonjour,

si tu veux garder ton système mais éviter l'appui sur le bouton, tu peux utiliser l'attribut "onchange" de la liste déroulante.

sinon, tu peux charger toutes les catégories et sous-catégories (dans un tableau) et traiter ca avec javascript.

ou enfin, le must, garder ton système, mais faire appel à ajax pour recharger qu'une portion de la page (les nouvelles liste déroulantes)

EDIT: on se grille mutuellement

Message édité par coca25 le 24-08-2007 à 14:34:06

------------------------------ Ne pas oublier le [resolu] pour finir le sujet.
Penser à voir les tutos, ca peut aider!
Répondre à coca25

[HS]Clair mais bon, t'as toujours des meilleures réponses que moi ![/HS]

Message édité par OmaR le 24-08-2007 à 14:37:05

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

Tout d'abord un grand merci à vous deux pour vos réponses !
Je vois que vous avez tous deux proposé la solution : ajax, ca sera donc pour moi l'occasion de découvrir un peu celà =)

J'ai donc fait une petite recherche et cette dernieère a débouchée sur cette page que j'ai commencé a dépioter : http://www.xul.fr/xml-ajax.html

Et donc là je viens de découvrir quelque chose grace à vous deux : il est donc possible de recharger une portion de page ('Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière.
Par exemple le contenu d'un champ de formulaire peut être changé, sans avoir à recharger la page avec le titre, les images, le menu, etc.
" ).

Serait ce possible d'avoir une petite explication approfondie et/ou (je veux pas non plus vous embeter avec ca) un petit bout de code pour illustrer celà, si possible avec une liste déroulante (sinon c'est pas grave, sans liste déroulante ca ira tout aussi bien) ^^.

J'en ai déjà trouvé un http://www.anaa.eu/demo-chain.html
Anna semble etre le module le plus adapté à mes besoins (Get et Post) Dites mois ou j'ai faux et aussi ou j'ai bon, si j'ai pas tout faux) ... :pt1cable:

En tout cas une nouvelle fois merci à vous deux ! :love:

Répondre à cameleon1st

la tu trouveras de quoi faire (avec des exemples)
http://gael-donat.developpez.com/web/intro-ajax/
http://dcabasson.developpez.com/ar [...] pas-a-pas/
http://siddh.developpez.com/articles/ajax/

et ca, c'est une librairie qui te facilite grandement la vie en ce qui concerne ajax et certaines taches en javascript.
http://dcabasson.developpez.com/ar [...] ype-1.4.0/

------------------------------ Ne pas oublier le [resolu] pour finir le sujet.
Penser à voir les tutos, ca peut aider!
Répondre à coca25

Wahou! Merci !! C'est vrai! J'aurais du y penser pour "developez" ! Encore une nouvelle fois merci! Dès que j'aurais fais ce que je souhaite je le posterai que tout le monde puisse en profiter

Cordialement

Répondre à cameleon1st

Avec une recherche encore un peu plus approfondie, j'ai trouvé le cas dans lequel je me trouve actuellement :

http://www.developpement-web.net/demos/demo_9/

Avec les explications :

http://www.developpement-web.net/a [...] eroulante/

Ici l'exemple est basé sur les départements mais le principe est le meme ! Je n'ai donc plus qu'à adapter le tout à mes besoins, c'est à dire en récupérant les valeurs stockées dans la base de données =)

Un grand merci encore à vous deux !

Cordialement

Répondre à cameleon1st

Comme promis, la résolution à ma problématique!

Contenu de la page index.php

Code :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function sendData(param, page)
{
if(document.all)
{
//Internet Explorer
var XhrObj = new ActiveXObject("Microsoft.XMLHTTP" ) ;
}
else
{
//Mozilla
var XhrObj = new XMLHttpRequest();
}
var content = document.getElementById("contenu" );
XhrObj.open("POST", page);
XhrObj.onreadystatechange = function()
{
if (XhrObj.readyState == 4 && XhrObj.status == 200)
content.innerHTML = XhrObj.responseText ;
}
XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
XhrObj.send(param);
}
</script>
</head>
<body>
<?php
include('../conf.php');
// Création d'une variable de test
$i=0;
// Création d'une variable pour conserver la valeur du premier enregistrement
$j=0;
// Récupération des données
$req_categorie = "SELECT id,nom_categorie FROM dr_telechargement_categorie ORDER BY nom_categorie;";
$result= mysql_query ($req_categorie) or die ("Récupération des données impossible" );
echo "<form method='POST' action='index.php'>";?> <select size="1" name="marque" OnChange="sendData('id='+this.value,'index_actu_liste.php')" onKeyUp="sendData('id='+this.value,'index_actu_liste.php')">
<?php
while ($dt=mysql_fetch_row($result))
{
// Remplissage de la liste déroulante, des données récupérées
echo "<option value=".($dt[0]).">".($dt[1])."</option>";
// On conserve la valeur du premier enregistrement
if ($i==0) { $j=$dt[0]; $i=1; }
}
?>
</select><br><br>
<div id="contenu">
<?php
// Affichage des sous catégories correspondant à la catégorie
echo "<select size='1' name='categorie'>";
$rq="SELECT * FROM dr_telechargement_fonction WHERE id_categorie=".$j." ORDER BY nom_fonction;";
$result= mysql_query ($rq) or die ("Recuperation des données impossible" );
// On innitialise la variable i
$i=0;
while ($dt=mysql_fetch_row($result))
{
echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[2])."</option><br>";
}
echo "</select>";
?>
</div>

Contenu de la page index_actu_liste.php

Code :

<?php
// Déclaration de ce qui va être afficher
header('Content-type: text') ;
// On test les POST précédemment émis
if(isset($_POST['id']) && !empty($_POST['id']) ){
include('../conf.php');
$rq="SELECT id,id_categorie,nom_fonction FROM dr_telechargement_fonction WHERE id_categorie=".$_POST['id']." ORDER BY nom_fonction;";
$result= mysql_query ($rq) or die ("Select impossible" );
// On initialise le variable la variable i
$i=0;
if (mysql_num_rows($result)>0)
{
echo "<select size='1' name='fonction'>";
}
else
{
echo utf8_encode("Aucune sous catégories disponible" );
}
while ($dt=mysql_fetch_row($result))
{
echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[2])."</option><br>";
}
echo "</select>";
}
?>

Pour ceux qui marchent sur ces traces ...

Répondre à cameleon1st

Créer un nouveau sujet Répondre

Tom's Guide > Forum > Programmation > [Résolu] [Php] Listes déroulantes à contenu interractif

Aller à :

Aide |
Règles du forum

Il y a 1494 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Page générée en 0,461 secondes

Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler

Liens