Multilevel Menu aus einer Datenbank

This site uses cookies. By continuing to browse this site, you are agreeing to our Cookie Policy.

  • Multilevel Menu aus einer Datenbank

    Guten Abend,
    ich habe mir mal ein Multilevel Menu zusammen gebastelt.
    Die Menüpunkte werden durch meine MYSQL Datenbank gefüllt.

    Meine "menü.php" sieht wie folgt aus:

    PHP Source Code: menu.php

    1. <?php
    2. // create an array to hold the references
    3. $refs = array();
    4. // create and array to hold the list
    5. $list = array();
    6. // the query to fetch the menu data
    7. $sql = "SELECT * FROM mainmenu ORDER BY menu_item_sorting";
    8. // get the results of the query
    9. $result = mysql_query($sql);
    10. // loop over the results
    11. while($data = @mysql_fetch_assoc($result))
    12. {
    13. // Assign by reference
    14. $thisref = &$refs[ $data['menu_item_id'] ];
    15. // add the the menu parent
    16. $thisref['menu_item_name'] = $data['menu_item_name'];
    17. $thisref['menu_item_url'] = $data['menu_item_url'];
    18. $thisref['menu_item_description'] = $data['menu_item_description'];
    19. $thisref['menu_parent_id'] = $data['menu_parent_id'];
    20. // if there is no parent id
    21. if ($data['menu_parent_id'] == 0)
    22. {
    23. $list[ $data['menu_item_id'] ] = &$thisref;
    24. }
    25. else
    26. {
    27. $refs[ $data['menu_parent_id'] ]['children'][ $data['menu_item_id'] ] = &$thisref;
    28. }
    29. }
    30. function create_list( $arr )
    31. {
    32. $html = "\n<ul id='main-menu'>\n";
    33. foreach ($arr as $key=>$output)
    34. {
    35. $html .= "<li><a href=".$output['menu_item_url'].">".$output['menu_item_name']."</a></li>\n";
    36. if (array_key_exists('children', $output))
    37. {
    38. $html .= "<li>";
    39. $html .= create_list($output['children']);
    40. $html .= "</li>\n";
    41. }
    42. else{}
    43. }
    44. $html .= "</ul>\n";
    45. return $html;
    46. }
    47. echo create_list( $list );
    48. ?>
    Display All

    Soweit so gut. Das Menü wird richtig ausgegeben...
    Nur ein Problem gibt es dabei.
    Das Menü soll vertikal sein und die Untermenüs erst einmal nicht sichtbar, sondern nur per Dropdown.
    Damit dies mit meinem Dropdown Script funktioniert muss, wenn der Menüpunkt ein Untermenü hat eine "class" zu dem "<li>"-Tag hinzugefügt werden.
    Somit müsste Zeile 42, des oben gezeigten Codes wie folgt in HTML aussehen, wenn der Menüpunkt einen Untermenü hat.

    HTML Source Code

    1. <li class="has-sub"><a href="...">...</a></li>
    Mir fällt aber kein weg ein, wie ich dass dann machen könnte.
  • PHP Source Code

    1. $hasChildren = (array_key_exists('children', $children) ? $children : false;
    2. $html .= "<li " . if ($hasChildren) { echo " class=\"hasChildren\"" } . "><a href=".$output['menu_item_url'].">".$output['menu_item_name']."</a></li>\n";
    oder versteh ich da was falsch?

    Alternativ würde es auch über JS gehen, indem du einfach nach einem <ul> in einem <li> suchst
  • Also so funktioniert es schon fast so, wenn ich es brauche.

    PHP Source Code

    1. <nav id="main-menu">
    2. <ul id="main-menu">
    3. <li class="menu-button"><a href="#">Item 1</a></li>
    4. <li class="menu-button"><a href="#">Item 2</a>
    5. <ul id="main-menu">
    6. <li class="menu-button"><a href="#">SubItem 1</a></li>
    7. <li class="menu-button"><a href="#">SubItem 2</a></li>
    8. <li class="menu-button"><a href="#">SubItem 3</a>
    9. <ul id="main-menu">
    10. <li class="menu-button"><a href="#">SubSubItem 1</a></li>
    11. <li class="menu-button"><a href="#">SubSubItem 2</a></li>
    12. <li class="menu-button"><a href="#">SubSubItem 3</a></li>
    13. </ul>
    14. </li>
    15. </ul>
    16. </li>
    17. </ul>
    18. </nav>
    Display All
    Dies ist aber meine HTML-Ausgabe des Menüs und ich möchte dir "class" nur setzten, wenn auch ein Submenü besteht.
  • Kurze Frage: Für was benötigst du so viele Classes? Eine übergeordnete Class reicht doch vollkommen aus, um alles anzusprechen:

    #main-menu -> Hauptmenü
    #main-menu li -> Menüpunkt
    #main-menu li ul -> Untermenü
    #main-menu li ul li -> Untermenüpunkt
    usw.

    Wenn du die Listenpunkte mit Kinderlisten ansprechen willst, sollte mit jQuery folgender Code funktionieren:

    Source Code

    1. $("#main-menu li ul").parent("li").addClass("has-sub");
    Erklärung: Suche alle ul innerhalb von li und füge deren Eltern-li die Class has-sub hinzu.

    JS-Fiddle Beispiel: jsfiddle.net/g3w04asx/
  • Hallo Liebe Programmierer,
    ich verzweifel!!!!! Und nachdem ich mein Problem gegoogelt hatte bin ich auf diesen Threat gestoßen und habe mich hier angemeldet, in der Hoffnung, dass ihr mir weiter helfen könnt.

    Ich verwende einen ganz ähnlichen Code den ich hier (simple-management-menu-php-mysql-jquery ist eine erweiterung von Nestable) her habe und für mich anpassen wollte.

    Leider stimmt etwas mit dem Arry item nicht, da sämtliche "Children" darin fehlen. Nur leider kann ich den Fehler nicht finden....

    Hier der php code:

    PHP Source Code

    1. <?php
    2. $ref = array();
    3. $items = array();
    4. $query = "SELECT * FROM temp_einteilung ORDER BY sort";
    5. $result = mysql_query($query);
    6. while($data = @mysql_fetch_assoc($result))
    7. {
    8. $thisRef = &$ref[ $data['id'] ];
    9. $thisRef['parent'] = (int) $data['parent'];
    10. $thisRef['groupID'] = $data['groupID'];
    11. $thisRef['type'] = $data['type'];
    12. $thisRef['id'] = (int) $data['id'];
    13. if ($data['parent'] == 0)
    14. {
    15. $items[ $data['id'] ] = &$thisRef;
    16. }
    17. else
    18. {
    19. $ref[ $data['parent'] ]['child'][ $data['id'] ] = &$thisRef;
    20. }
    21. }
    22. print_r ($items);
    23. function get_menu($items,$class = 'dd-list') {
    24. $html = "<ol class=\"".$class."\" id=\"menu-id\">";
    25. foreach($items as $key=>$value) {
    26. $html.= '<li class="dd-item dd3-item" data-id="'.$value['id'].'" >
    27. <div class="dd-handle dd3-handle">Drag</div>
    28. <div class="dd3-content"><span id="label_show'.$value['id'].'">Pilot: '.$value['groupID'].' / Helfer: '.$value['groupID'].' / Klasse: '.$value['groupID'].'</span>
    29. </div>';
    30. if(array_key_exists('child',$value)) {
    31. $html .= get_menu($value['child'],'child');
    32. }
    33. $html .= "</li>";
    34. }
    35. $html .= "</ol>";
    36. return $html;
    37. }
    38. print get_menu($items);
    39. ?>
    Display All
    Und das ist die SQL Tabelle:



    SQL-Query

    1. -- Tabellenstruktur für Tabelle `temp_einteilung`
    2. CREATE TABLE `temp_einteilung` (
    3. `id` int(10) NOT NULL,
    4. `type` varchar(25) NOT NULL,
    5. `groupID` int(3) NOT NULL,
    6. `parent` int(3) UNSIGNED NOT NULL DEFAULT '0',
    7. `sort` int(3) UNSIGNED NOT NULL DEFAULT '0'
    8. ) ENGINE=InnoDB DEFAULT CHARSET=latin1;
    9. --
    10. -- Daten für Tabelle `temp_einteilung`
    11. --
    12. INSERT INTO `temp_einteilung` (`id`, `type`, `groupID`, `parent`, `sort`) VALUES
    13. (62, 'Gruppe1', 0, 0, 1),
    14. (63, 'Pilot', 1279, 1, 2),
    15. (64, 'Pilot', 1280, 1, 3),
    16. (65, 'Gruppe2', 0, 0, 4),
    17. (66, 'Pilot', 1281, 1, 5),
    18. (67, 'Pilot', 1282, 1, 6),
    19. (68, 'Gruppe3', 0, 0, 7),
    20. (69, 'Pilot', 1283, 1, 8),
    21. (70, 'Gruppe4', 0, 0, 9),
    22. (71, 'Pilot', 1284, 1, 10),
    23. (72, 'Pilot', 1285, 1, 11),
    24. (73, 'Gruppe5', 0, 0, 12),
    25. (74, 'Pilot', 1286, 1, 13),
    26. (75, 'Pilot', 1287, 1, 14),
    27. (76, 'Gruppe6', 0, 0, 15),
    28. (77, 'Pilot', 1288, 1, 16),
    29. (78, 'Pilot', 1289, 1, 17),
    30. (79, 'Gruppe7', 0, 0, 18),
    31. (80, 'Pilot', 1290, 1, 19),
    32. (81, 'Pilot', 1291, 1, 20),
    33. (82, 'Gruppe8', 0, 0, 21),
    34. (83, 'Pilot', 1292, 1, 22),
    35. (84, 'Pilot', 1293, 1, 23),
    36. (85, 'Gruppe9', 0, 0, 24),
    37. (86, 'Pilot', 1294, 1, 25),
    38. (87, 'Pilot', 1295, 1, 26);
    39. --
    40. -- Indizes der exportierten Tabellen
    41. --
    42. --
    43. -- Indizes für die Tabelle `temp_einteilung`
    44. --
    45. ALTER TABLE `temp_einteilung`
    46. ADD PRIMARY KEY (`id`);
    47. --
    48. -- AUTO_INCREMENT für exportierte Tabellen
    49. --
    50. --
    51. -- AUTO_INCREMENT für Tabelle `temp_einteilung`
    52. --
    53. ALTER TABLE `temp_einteilung`
    54. MODIFY `id` int(10) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=88;
    55. /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
    56. /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
    57. /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
    Display All
    Output print_r($items);


    Array ( [62] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe1 [id] => 62 ) [65] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe2 [id] => 65 ) [68] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe3 [id] => 68 ) [70] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe4 [id] => 70 ) [73] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe5 [id] => 73 ) [76] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe6 [id] => 76 ) [79] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe7 [id] => 79 ) [82] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe8 [id] => 82 ) [85] => Array ( [parent] => 0 [groupID] => 0 [type] => Gruppe9 [id] => 85 ) )


    Habt ihr eine Idee warum die children im $items array fehlen?

    Hoffe echt ihr könnt mir helfen, verzweifel jetzt schon zwei Abende daran.

    Gruß Christoph