Categories > TinyButStrong general (FR) >

[fr] Menu

The forum is closed. Please use Stack Overflow for submitting new questions. Use tags: tinybutstrong , opentbs
By: Njsan
Date: 2004-06-20
Time: 13:54

[fr] Menu

Bonjour

A partir d'une base SQL je souhaite construire un menu à n niveau tu type
Menu1
  Menu 1.1
  Menu 1.2
    Menu 1.2.1
    Menu 1.2.2
      ....
    Menu 1.2.3
  Menu 1.3
Menu2
  Menu2.1
    ...
  Menu 2.2

Le problème est que je ne sais pas comment  faire avec TBS...
Enfin je pense qu'il faut utiliser la réccursivité, mais TBS peut il le faire et comment?

@+
By: Skrol29
Date: 2004-06-21
Time: 10:21

Re: [fr] Menu

Bonjour,

Il y a déjà une long discussion la dessus sur ce forum.
http://www.tinybutstrong.com/index.php?page=forum&msg_id=564

En résumé, il est conseillé en général (c'est à dire même hors TBS) de sauvegarder les informations pour la présentation hiérarchique dans la base, avec les items du menu. Exemple:
  Id, Titre, Id_Parent, Ordre, Identiation
Il y plusieurs raisons à cela, notamment les perfs.

Si tu tiens tout de même à faire un menu hiérarchique dynamique, il y une astuce avec TBS. Je crois me rappeler qu'elle est décrite dans le fil de discussion cité plus haute. Mais en gros, il s'agit d'utiliser les sous-blocs de façon redondante.
By: Njsan
Date: 2004-06-21
Time: 12:04

Re: [fr] Menu

Vu mon niveau en anglais, je n'ai pas tout compris, mais avec quelques tests .... çà devrait aller!!!
Au pire je reviendrais ^_^
By: Njsan
Date: 2004-06-21
Time: 19:10

Re: [fr] Menu

RE

J'ai essayé de suivre les instruction au plus près .. mais rien ne s'affiche !!!!!
J'ai sans doute raté une marche, as-tu un source qui marche ???

Merci
By: Skrol29
Date: 2004-06-23
Time: 11:57

Re: [fr] Menu

Donne moi la structure des données qui te serts à afficher ton menu.
Je vais essayer de te donner un exemple sur mesure.
By: Njsan
Date: 2004-06-23
Time: 19:09

Re: [fr] Menu

Re

Voici la table de données:
#
# Structure de la table `nj_prod_tmenu`
#

CREATE TABLE nj_prod_tmenu (
  menMenu tinytext NOT NULL,
  menIdent tinytext NOT NULL,
  menParent tinytext NOT NULL,
  menLabel tinytext NOT NULL,
  menLien tinytext NOT NULL,
  menTarget tinytext NOT NULL,
  menTitre tinytext
) TYPE=MyISAM;

#
# Contenu de la table `nj_prod_tmenu`
#

INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1', '-1', 'Menu1', '#', '_self', 'Premier menu');
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '2', '-1', 'Menu2', '#', '_self', 'Deuxieme menu');
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1_1', '1', 'Menu1_1', '#', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1_1_1', '1_1', 'Menu1_1_1', '../../Centre/Bienvenue/page2.php', 'Bienvenue', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1_1_2', '1_1', 'Menu1_1_2', '#', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1_2', '1', 'Menu1_2', '#', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1_3', '1', 'Menu1_3', '#', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '2_1', '2', 'Menu2_1', '#', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '2_2', '2', 'Menu2_2', '#', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '1_1_2_1', '1_1_2', 'Menu1_1_2_1', 'dfsdfsdf', '_self', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', 'Admin', '-1', 'Administration', '../../Admin/Menu/menu.php', 'Menu', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuAdmin', '1', '-1', 'Agenda', '../../timecop/index.php', 'Bienvenue', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuAdmin', 'Return', '-1', 'Retour', '../../Gauche/Menu/menu.php', 'Menu', NULL);
INSERT INTO nj_prod_tmenu VALUES ('MenuPrincipal', '3', '-2', '', '', '', NULL);

Je suis arrivé au resultat souhaité, mais de façon peut catholique ...

Le modele:
html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function mnone(id){
document.getElementById(id).style.display='none';
}

function inverse(id,tm1,tm2,ch) {
  if (document.getElementById)
  {
     var ident=document.getElementById(id);
     var change=document.getElementById(ch);
     if (ident.className==tm1)
     {ident.className=tm2}
     else
     {ident.className=tm1}
      
     if (change.style.display=='none')
     {change.style.display='block';}
     else
     {change.style.display='none';}
  }
}
//-->
</script>
<style type="text/css">
body{
    background-color: #FFFFFF;
    scrollbar-face-color: #081084;
    scrollbar-shadow-color: #000000;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-3dlight-color: #000000;
    scrollbar-darkshadow-color: #000000;
    scrollbar-track-color: #BDC6E7;
    scrollbar-arrow-color: #FFCC00;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
}

ul {
margin-left: 0;
padding: O;
}

li {
    margin-left: 10;
    padding: O;
    list-style-type: none;
}

.menu_plus {
display: block;
}
.menu_plus a:visited {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/plusoff.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}
.menu_plus a:active {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/plusoff.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}
.menu_plus a:hover {
    color: #BDC6E7;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/pluson.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}
.menu_plus a:link {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/plusoff.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}

.menu_moins {
display: block;
}
.menu_moins a:visited {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/moinsoff.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}
.menu_moins a:active {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/moinsoff.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}
.menu_moins a:hover {
    color: #BDC6E7;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/moinson.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}
.menu_moins a:link {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    background-image: url(Images/Petit/moinsoff.gif);
    background-position: left center;
    background-repeat: no-repeat;
    text-decoration: none;
}

a:visited {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-decoration: none;
}
a:active {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-decoration: none;
}
a:hover {
    color: #BDC6E7;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-decoration: none;
}
a:link {
    color: #081084;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-decoration: none;
}
-->
</style>
<link href="Css/menu0.css" rel="stylesheet" type="text/css">

</head>

<body onLoad="[liste;block=begin]mnone('M_[liste.menIdent][liste.menParent]');[liste;block=end]">

<div id="menu"><ul>

  [modele;block=begin]
  <div id="M_[menu%Ni%.menIdent][menu%Ni%.menParent]"><ul>
    [menu%N%;block=begin;p1='[menu%Ni%.menIdent]']
      <li><div id="I_[menu%N%.menIdent][menu%N%.menParent]"
      [tbs_check.%N%;block=begin;if [menu%N%.menLien]='#']
           class="menu_plus"
           onClick="inverse('I_[menu%N%.menIdent][menu%N%.menParent]',
                            'menu_plus','menu_moins',
                            'M_[menu%N%.menIdent][menu%N%.menParent]');
                             return false;"
       [tbs_check.%N%;block=end] >
        <a href="[menu%N%.menLien]"
           target="[menu%N%.menTarget]"
           title="[menu%N%.menTitre]">&nbsp;&nbsp;&nbsp;[menu%N%.menLabel]
      </div></li>{}
    [menu%N%;block=end]
  </ul></div>
  [modele;block=end]

</div>

</body>
</html>


Le code PHP:
<?
include_once('Class/tbs_class.php');
include_once('Config/cmysql.php');

  if (isset($menu)) {} else { $menu='MenuPrincipal';}
  $LinkDB=mysql_connect("$host","$user","$passe");
  $select_base=mysql_selectdb("$base");
  if (!$select_base) { echo "ERREUR DE CONNECTION !!! "; }
  else
  {
    $query1 = "SELECT menIdent FROM nj_prod_tmenu WHERE menParent='-2'";
    $result=mysql_query($query1,$LinkDB);
     $niveau=mysql_result($result, 0, menIdent)+1;
/*     $niveau=3; */
/*     print $niveau; */
   
    $TBS=new clsTinyButStrong;
    $TBS->LoadTemplate('menu5.html');
   
    $modele=$TBS->GetBlockSource('modele');
/*     print $modele."<br>-----------------<br>";  */
    $final=$modele;
/*     print $final."<br>-----------------<br>";  */
    for($i=0;$i<=$niveau;$i++){
      if ($i!=0){
      $final=str_replace('{}',$modele,$final); 
      }
      else{
      $final=str_replace('[menu%Ni%.menIdent]','-1',$final);
      }
      $final=str_replace('%N%',$i,$final);
      $final=str_replace('%Ni%',$i-1,$final);
    }
    $final=str_replace('{}','',$final);
/*     print $final."<br>-----------------<br>";  */
   
/*     print $modele; */
    $TBS->MergeBlock('modele','text',$final);
   
    $men="menu";
    for($i=0;$i<=$niveau;$i++){
/*       print $i; */
      $TBS->MergeBlock($men.$i,$LinkDB,'SELECT * FROM nj_prod_tmenu WHERE menMenu=\''.$menu.'\' AND  menParent=\'%p1%\' ORDER BY menIdent');
    }
    $TBS->MergeBlock(liste,$LinkDB,'SELECT * FROM nj_prod_tmenu WHERE menMenu=\''.$menu.'\' AND menParent!=\'-2\'  ORDER BY menIdent');
/*     $TBS->MergeBlock(liste2,$LinkDB,'SELECT * FROM nj_prod_tmenu WHERE menMenu=\''.$menu.'\' AND menParent!=\'-2\' ORDER BY menIdent'); */
    mysql_close($LinkDB);
    $TBS->Show();
  }
?>

En gros à partir du bloc 'modele' je construit par code php les blocs finaux qui est du type:

[menu0;block=begin;p1='-1']
  [menu1;block=begin;p1='[menu0.menIdent]']
    [menu2;block=begin;p1='[menu1.menIdent]']
      .
      .
      .
    [menu2;block=end]
  [menu1;block=end]
[menu0;block=end]

@+