Charger contenu dynamic à la selection
markaz
Messages postés
331
Date d'inscription
Statut
Membre
Dernière intervention
-
tryan44 Messages postés 1288 Date d'inscription Statut Membre Dernière intervention -
tryan44 Messages postés 1288 Date d'inscription Statut Membre Dernière intervention -
Bonjour, je suis sur un site dynamique lié à une BD qui affiche une catégorie d'article et au click charge toutes les sous catégories liées à la catégorie sélectionnée.
J'explique mieux:
dans mon BD j'ai deux tables 'CATEGORIER' (qui contient les catégories d'articles) et 'SOUS CATREGORIE' (qui contient les sous catégories d'articles).
sur ma page, j'affiche les catégorie par un while (condition).
Je voudrais donc afficher les sous catégorie liées à la catégorie au click du nom de celle-ci.
L'affichge devient un peu comme une arborescence.
Exemple:
>Catégorie1
- Sous-catégorie1
- Sous-catégorie2
- Sous-catégorieN
>Catégorie2
>Catégorie3
>CatégorieN
Comment faire?
Merci d'avance pour votre aide.
J'explique mieux:
dans mon BD j'ai deux tables 'CATEGORIER' (qui contient les catégories d'articles) et 'SOUS CATREGORIE' (qui contient les sous catégories d'articles).
sur ma page, j'affiche les catégorie par un while (condition).
Je voudrais donc afficher les sous catégorie liées à la catégorie au click du nom de celle-ci.
L'affichge devient un peu comme une arborescence.
Exemple:
>Catégorie1
- Sous-catégorie1
- Sous-catégorie2
- Sous-catégorieN
>Catégorie2
>Catégorie3
>CatégorieN
Comment faire?
Merci d'avance pour votre aide.
A voir également:
- Charger contenu dynamic à la selection
- Word a trouvé du contenu illisible - Guide
- Le fichier à télécharger correspond au contenu brut d’un courrier électronique. de quel pays a été envoyé ce message ? - Guide
- Fusionner deux cellules excel en gardant le contenu - Guide
- Aucun accès à internet charger la page plus tard - Forum Réseau
- Contenu multimedia messenger disparu - Forum Facebook Messenger
6 réponses
Il faut faire passer l'id de la catégorie dans la div concerné.
Dans la fonction lancé par onclick ainsi que dans le div, il faut y faire passer le numéro de la catégorie "boiteid"
<script language="javascript" type="text/javascript">
function bascule(elem)
{
etat=document.getElementById(elem).style.display;
if(etat=="none"){
document.getElementById(elem).style.display="block";
}
else{
document.getElementById(elem).style.display="none";
}
}
</script>
<a onclick="bascule('boite1'); return false;">categorie 1</a>
<div id='boite1' style='display:none;'>
Sous cat 1
Sous cat 2
</div>
<a onclick="bascule('boite2'); return false;">categorie 2</a>
<div id='boite2' style='display:none;'>
Sous cat 1
Sous cat 2
</div>
Dans la fonction lancé par onclick ainsi que dans le div, il faut y faire passer le numéro de la catégorie "boiteid"
Salut,
Il faut faire une seconde boucle while à l'intérieure de la première (l'idéal serait quand même une jointure) pour récupérer les sous catégories de chaque catégories. L'ensemble des sous catégories d'une catégorie doivent être placés dans un "div" caché (display:none) et lors du clique sur la catégorie, le "div" caché passe en visible (display:block) et pour ça il faut utiliser un poil de javascript.
Il faut faire une seconde boucle while à l'intérieure de la première (l'idéal serait quand même une jointure) pour récupérer les sous catégories de chaque catégories. L'ensemble des sous catégories d'une catégorie doivent être placés dans un "div" caché (display:none) et lors du clique sur la catégorie, le "div" caché passe en visible (display:block) et pour ça il faut utiliser un poil de javascript.
poste ton code actuel
Voici mon code actuel:
Script Javascript et css
Code PHP
NB: Mes requête sont déjà faites.
Le résultat : une seul ligne envoyé ( la première de la table sous catégorie).
Script Javascript et css
<script type="text/javascript">
function affichercacher ()
{
if (addr.id == "afficher") addr.id = "cacher";
else addr.id = "afficher";
}
window.onload = function () {
addr = document.getElementById("afficher");
}
</script>
<style type="text/css">
#afficher { visibility : hidden; }
#cacher { visibility : visible; }
</style>
Code PHP
<?php do { ?>
<div onmousedown="affichercacher();"><?php echo $drcategorie['titrecategorie']; ?>
<?php
$sqlsouscategorie = ('select * from categorie, souscategorier where categorie.idcateg = souscategorier.idcateg');
$rsouscateg= mysql_query($sqlsouscategorie) or die ('Erreur '.$sqlsouscategorie.' '.mysql_error());
$result = mysql_fetch_assoc($rsouscateg);
do { ?>
<div id="afficher"><?php echo $result['titresouscategorier'];?></div>
<?php } while( $result = mysql_fetch_assoc($rsouscateg)) ?>
</div> <?php } while($drcategorie= mysql_fetch_assoc($rcategorie))?>
NB: Mes requête sont déjà faites.
Le résultat : une seul ligne envoyé ( la première de la table sous catégorie).
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
une piste: je n'ai pas testé il peut y avoir des bugs
<script type="text/javascript">
function affichercacher (id_div){
//on va d'abord cacher la sous categorie éventuellement affichée
var divs = document.getElementsByTagName('div');
for (var i = 1, i <= divs.length ; i++) {
if(divs[i].id.substr(0,8)=='sous_cat_'){
document.getElementById('sous_cat_'+i).style.display='none';
}
}
//on affiche la sous cat voulue
var div_a_afficher=document.getElementById(id_div);
div_a_afficher.style.display='block';
}
</script>
<style type="text/css">
.sous_cat{
margin-left:30px;
}
</style>
Code PHP
<?php
$id=1;
do {
?>
<div onmousedown="affichercacher('sous_cat_<?php echo $id; ?>');"><?php echo $drcategorie['titrecategorie']; ?>
<?php
$sqlsouscategorie = ('select * from categorie, souscategorier where categorie.idcateg = souscategorier.idcateg');
$rsouscateg= mysql_query($sqlsouscategorie) or die ('Erreur '.$sqlsouscategorie.' '.mysql_error());
$result = mysql_fetch_assoc($rsouscateg);
do {
//on va mettre un div different pour chaque categorie grage au compteur $id
echo '<div id="sous_cat_'.$id.'" class="sous_cat">'.$result['titresouscategorier'].' style="display:none;"</div>';
$id++;
} while( $result = mysql_fetch_assoc($rsouscateg)) ?>
</div> <?php } while($drcategorie= mysql_fetch_assoc($rcategorie))?>
je vois que tu utilises firefox alors va voir dans la console d'erreur pour voir les pb javascript
et regardes dans le code source de la page pour voir si toutes les cat et sous cat sont bien codées
et regardes dans le code source de la page pour voir si toutes les cat et sous cat sont bien codées
bon mon code ne marche pas, j'avait fait un peu n'importe quoi, ci dessous un exemple qui fonctionne avec des catégories et sous cat en dur.
par contre dans la partie code php qui genere les cat et sous cat dynamiquement mets $id=0;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<script type="text/javascript">
function affichercacher (id_div){
//// on va d'abord cacher la sous categorie éventuellement affichée
//recherche de tous les div du document et mise dans un array "divs"
divs= new Array();
divs = document.getElementsByTagName('div');
//on parcours tout cet array
for (var i = 0;i < divs.length ; i++) {
//recherche des div qui ont un id commençant par sous_cat_
if(divs[i].id.substr(0,9)=='sous_cat_'){
//si c'est le cas on masque le div eventuelement ouvert
document.getElementById(divs[i].id).style.display='none';
}
}
/////
////// puis on affiche la sous cat voulue
var div_a_afficher=document.getElementById(id_div);
div_a_afficher.style.display='block';
}
</script>
<style type="text/css">
.sous_cat{
margin-left:30px;
}
</style>
</head>
<body>
<div onmousedown="affichercacher('sous_cat_0');">Categorie 1
<div id="sous_cat_0" class="sous_cat" style="display:none;" >
- sous_categorie 1-1<br />
- sous_categorie 1-2<br />
- sous_categorie 1-3<br />
</div>
</div>
<div onmousedown="affichercacher('sous_cat_1');">Categorie 2
<div id="sous_cat_1" class="sous_cat" style="display:none;" >
- sous_categorie 2-1<br />
- sous_categorie 2-2<br />
- sous_categorie 2-3<br />
- sous_categorie 2-4<br />
</div>
</div>
<div onmousedown="affichercacher('sous_cat_2');">Categorie 3
<div id="sous_cat_2" class="sous_cat" style="display:none;" >
- sous_categorie 3-1<br />
- sous_categorie 3-2<br />
</div>
</div>
</body>
</html>
par contre dans la partie code php qui genere les cat et sous cat dynamiquement mets $id=0;
while(){ echo '<a onclick="bascule(\'boite'.$id_categorie.'\'); return false;">'.$nom_categorie.'</a> <div id=\'boite1'.$id_categorie.'\' style=\'display:none;\'> '.$nom_sous_categorie.'<br/> </div>'; }