[sql] Opbouw Menu
Ben momenteel bezig met een menu-boom te maken.
Het probleem: hij selecteerd netjes alle menu onderdelen maar nu moet ik ze orderen, ism met $_GET.
Hij selecteerd:
- De Heidewachtel
-- Ontstaan
-- kennelnaam
-- Pups
-- Onze Honden
--- Test Pagina Heidewachtels
--- Test Test Pagina Heidewachtels
De Streepjes zijn onderliggende pagina's, maar hoe zorg ik dat ze met een get-actie pas zichtbaar worden...
dus als ik zeg maar Heidewachtels selecteer en de eerste resultaten weergeeft dat zijn dus Ontstaan, kennelnaam, Pups en onze honden zichtbaar word en als ik dan op onze honden klik dat de Test Pagina Heidewachtels en Test Test Pagina Heidewachtels pagina wordt weergeven ?
Mijn sql:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
$sql_ =
"
SELECT
*
FROM
Pagina AS t1
INNER JOIN
Pagina AS t2
ON
t2.PaginaSid = t1.PaginaId
AND
t1.GroepId = '" . $Groep_ . "'
";
"
SELECT
*
FROM
Pagina AS t1
INNER JOIN
Pagina AS t2
ON
t2.PaginaSid = t1.PaginaId
AND
t1.GroepId = '" . $Groep_ . "'
";
De sql Tabel:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
PaginaId PaginaSid GroepId PaginaTitel PaginaContent
8 NULL 6 Ook een Bulldog
9 NULL 5 De Heidewachtel
10 NULL 4 SUFFOLK SCHAPEN
12 NULL 0 Welkom Op Onze Website
17 0 0 Werkt nu wel
20 9 5 Ontstaan kennelnaam
21 9 5 Pups
22 8 6 Onze Bulldogs
28 9 5 Onze Honden
31 20 5 Test Pagina Heidewachtels
32 31 5 Test Test Pagina Heidewachtels
30 22 6 In memoriam
8 NULL 6 Ook een Bulldog
9 NULL 5 De Heidewachtel
10 NULL 4 SUFFOLK SCHAPEN
12 NULL 0 Welkom Op Onze Website
17 0 0 Werkt nu wel
20 9 5 Ontstaan kennelnaam
21 9 5 Pups
22 8 6 Onze Bulldogs
28 9 5 Onze Honden
31 20 5 Test Pagina Heidewachtels
32 31 5 Test Test Pagina Heidewachtels
30 22 6 In memoriam
Kleine Bump....
Dat is misschien makkelijker te maken met javascript, dan kun je zoiets maken:
http://dev.themadman.nl/menu.html
'Onze Honden' klapt nog niet uit in het voorbeeld.
ik heb net een 2-level menu geschreven. maar 3-level is ook goed mogelijk (gewoon doorbouwen op de foreach).
zie hier: de php code. ps, is in zend geschreven. het enigste wat je hoeft te herschrijven is de select functie
$sql = "SELECT * FROM menu ORDER BY parent_id, id ASC";
word hem dan.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<?php
class Menu extends Zend_Db_Table
{
protected $_name = 'menu';
public function _getMenu()
{
$select = $this->select()->order('parent_id')->order('id ASC');
$rowset = $this->fetchAll($select);
foreach ($rowset as $MenuItem) {
if ($MenuItem->parent_id == '0') {
$parent_menu[$MenuItem->id]['id'] = $MenuItem->id;
$parent_menu[$MenuItem->id]['label'] = $MenuItem->menu_name;
$parent_menu[$MenuItem->id]['link'] = $MenuItem->menu_link;
$parent_menu[$MenuItem->id]['count'] = '0';
} else {
$sub_menu[$MenuItem->id]['parent_id'] = $MenuItem->parent_id;
$sub_menu[$MenuItem->id]['label'] = $MenuItem->menu_name;
$sub_menu[$MenuItem->id]['link'] = $MenuItem->menu_link;
$parent_menu[$MenuItem->parent_id]['count']++;
}
}
$MenuList = $this->dynamic_menu($parent_menu, $sub_menu);
return $MenuList;
}
protected function dynamic_menu($parent_array, $sub_array)
{
$menu = '<ul id="menu">';
foreach ($parent_array as $pkey => $pval) {
$menu .= "<li><a class='parent_button' href='".$pval['link']."'>".$pval['label']."</a>";
if ($pval['count'] > '0') {
$menu .= "<ul>";
foreach ($sub_array as $skey => $sval) {
if($sval['parent_id'] == $pval['id']) {
$menu .= "<li><a class='sub_button' href='".$sval['link']."'>".$sval['label']."</a></li>";
}
}
$menu .= "</ul>";
}
$menu .= "</li>";
}
$menu .= "</ul></div>";
return $menu;
}
}
[/code]
css
[code]
#menu, #menu ul {
list-style: none;
margin-top: -10px;
}
#menu li {
float: left;
position: relative;
width: 172px;
height: 36px;
padding-left: 16px;
}
#menu li ul {
position: absolute;
display: none;
padding-top: 18px;
margin-left: -12px;
}
#menu li:hover ul, #menu li.over ul {
display:block;
}
.parent_button {
display: block;
color:red;
font-size: 18px;
font-weight: bold;
}
.sub_button {
color: black;
font-size: 15px;
text-decoration: none;
}
.sub_button:hover {
text-decoration: underline;
}
[/code]
ps. de reden waarom ik .sub_button en .parent_button gebruik is omdat ik dat makkelijker vind stylen. het hoeft natuurlijk niet.
en als laatste je database opzet word zoiets als:
Table: Menu
id (int)
parent_id (int)
menu_name
menu_link
ps. je hoeft het natuurlijk niet te gebruiken maar volgens mij is hier geen javascript voor nodig en heb je op deze manier een nette manier om alles uit een database te trekken en je menu op te zetten.
Nog even snel een edit.
De css is een aangepaste versie van:
http://www.javascriptsearch.com/guides/Beginner/articles/061024DropDownMenu.html
zie daar ook een voorbeeld. Daar zit helaas niet de php bij, maar met een beetje aanpassen moet het je lukken de layout van je uiteindelijke html(source code bekijken;)) net zo te krijgen als daar en de CSS ook te kunnen gebruiken
class Menu extends Zend_Db_Table
{
protected $_name = 'menu';
public function _getMenu()
{
$select = $this->select()->order('parent_id')->order('id ASC');
$rowset = $this->fetchAll($select);
foreach ($rowset as $MenuItem) {
if ($MenuItem->parent_id == '0') {
$parent_menu[$MenuItem->id]['id'] = $MenuItem->id;
$parent_menu[$MenuItem->id]['label'] = $MenuItem->menu_name;
$parent_menu[$MenuItem->id]['link'] = $MenuItem->menu_link;
$parent_menu[$MenuItem->id]['count'] = '0';
} else {
$sub_menu[$MenuItem->id]['parent_id'] = $MenuItem->parent_id;
$sub_menu[$MenuItem->id]['label'] = $MenuItem->menu_name;
$sub_menu[$MenuItem->id]['link'] = $MenuItem->menu_link;
$parent_menu[$MenuItem->parent_id]['count']++;
}
}
$MenuList = $this->dynamic_menu($parent_menu, $sub_menu);
return $MenuList;
}
protected function dynamic_menu($parent_array, $sub_array)
{
$menu = '<ul id="menu">';
foreach ($parent_array as $pkey => $pval) {
$menu .= "<li><a class='parent_button' href='".$pval['link']."'>".$pval['label']."</a>";
if ($pval['count'] > '0') {
$menu .= "<ul>";
foreach ($sub_array as $skey => $sval) {
if($sval['parent_id'] == $pval['id']) {
$menu .= "<li><a class='sub_button' href='".$sval['link']."'>".$sval['label']."</a></li>";
}
}
$menu .= "</ul>";
}
$menu .= "</li>";
}
$menu .= "</ul></div>";
return $menu;
}
}
[/code]
css
[code]
#menu, #menu ul {
list-style: none;
margin-top: -10px;
}
#menu li {
float: left;
position: relative;
width: 172px;
height: 36px;
padding-left: 16px;
}
#menu li ul {
position: absolute;
display: none;
padding-top: 18px;
margin-left: -12px;
}
#menu li:hover ul, #menu li.over ul {
display:block;
}
.parent_button {
display: block;
color:red;
font-size: 18px;
font-weight: bold;
}
.sub_button {
color: black;
font-size: 15px;
text-decoration: none;
}
.sub_button:hover {
text-decoration: underline;
}
[/code]
ps. de reden waarom ik .sub_button en .parent_button gebruik is omdat ik dat makkelijker vind stylen. het hoeft natuurlijk niet.
en als laatste je database opzet word zoiets als:
Table: Menu
id (int)
parent_id (int)
menu_name
menu_link
ps. je hoeft het natuurlijk niet te gebruiken maar volgens mij is hier geen javascript voor nodig en heb je op deze manier een nette manier om alles uit een database te trekken en je menu op te zetten.
Nog even snel een edit.
De css is een aangepaste versie van:
http://www.javascriptsearch.com/guides/Beginner/articles/061024DropDownMenu.html
zie daar ook een voorbeeld. Daar zit helaas niet de php bij, maar met een beetje aanpassen moet het je lukken de layout van je uiteindelijke html(source code bekijken;)) net zo te krijgen als daar en de CSS ook te kunnen gebruiken
Gewijzigd op 01/01/1970 01:00:00 door Thijs Damen
Maak een extra veld aan waar je een rank in zet. Dan kun je via ORDER BY rang ASC alles in de volgorde zetten welke jij wilt.
Levels moeten onbeperkt zijn.
maar ik zit grotendeels met het selecteren uit de database
dus als op de heidewachtel wordt geklik dat dan met een GET (?pagina=content&gid=3&sid=9, is de get dus)
GID = Groeps ID
SID = Sub ID
maar als hij dus de sub id uitleest dan weergeeft hij 'De heidewachtel' niet meer, hoe zorg ik er dan voor dat hij wel zichtbaar blijft ?...
@ Thijs, Das OO(P) of niet ?.
Edit:
@Jezpur: Dat is een idee, zal er even naar kijken.
Gewijzigd op 01/01/1970 01:00:00 door Bart Tuma
Wat je misschien ook zou kunnen doen om je doel te bereiken is om een extra tabel te maken speciaal voor menu items.
en dan menu_id op te nemen in je content tabel. zo de link te leggen tussen de huidige te weergeven pagina. en menu opties.
dan kom je uit op:
content:
pagina_id, titel, content, FK menu_id
menu:
PK id, parent_id, naam, link
en dan bijvoorbeeld mijn code aanpassen met:
[code
$menu .= "<li><a class='parent_button' href='".$pval['link']."'?id=".$pval['id'].">".$pval['label']."</a>"