I have a menu in a database (phpmyadmin) which I am feeding into my header with a while loop. But one of the menu items has a dropdown. How can I alter my while loop below so that it integrates the submenu? In other words, Home, How It Works, Blog, About and Contact remain as links, while Services remains a dropdown that shows a separate while loop with pages Service1, Service2, Service3...Service nth?
Here is what I got working so far
My connection up top
<?php
require_once('db/db_database.php');
// These are menu items Home(id=1), Services(id=2), How It Works(id=3), Blog(id=4), About(id=5), & Contact(id=6)
$sql = " SELECT * FROM menu WHERE id IN (1, 2, 3, 4, 5, 6) ";
$result = $conn->query($sql);
// These are submenu items Svs1(id=10), Svs2(id=20), Svs3(id=30)
$sql2 = " SELECT * FROM menu WHERE id IN (10, 20, 30) ";
$result2 = $conn->query($sql2);
?>
My main menu loop which works fine without submenus
<?php
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
echo '<li class="nav-item dropdown active">';
echo '<a href="' . $row["link"] . '" class="nav-link dropdown-toggle animated fadeIn animation-delay-7">' . $row["pagename"] . '</a>';
echo '</li>';
}
} else {
echo "0 results";
}
?>
and my submenu structure that I would like nested in the loop above
<li class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="services">
Services
<i class="zmdi zmdi-chevron-down"></i>
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="">
Service 1
</a>
</li>
<li>
<a class="dropdown-item" href="">
Service 2
</a>
</li>
<li>
<a class="dropdown-item" href="">
Service 3
</a>
</li>
</ul>
</li>
**Please notice the entire class group in the li is different than a regular link, hence why I am even more stumped. Also the Services dropdown comes second in the order in which it displays. So I can't just add it the end separately, hene why I am assuming that it should be nested to break the loop and restart the loop after it for the rest of the menu items.
p.s. I could run 3 queries (1 for the home link only, another for the services dropdown, and a third one for the rest of the menu items) but I know there has to be a better way.
Here is an idea of the desired look
Thanks in advance guys! Not that it would help because you need a connection, but here is a codepen with my code for this menu if you want to play with it
EDIT
To make it a bit easier here is what I have now that works fine but too bloated. (3 queries)
<?php
if ($resulthome->num_rows > 0) {
// output data of each row
while($row = $resulthome->fetch_assoc()) {
echo '<li class="nav-item dropdown active">';
echo '<a href="' . $row["link"] . '" class="nav-link dropdown-toggle animated fadeIn animation-delay-7">' . $row["pagename"] . '</a>';
echo '</li>';
}
} else {
echo "0 results";
}
?>
<li class="nav-item dropdown active">
<a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="services">
Services
<i class="zmdi zmdi-chevron-down"></i>
</a>
<ul class="dropdown-menu">
<?php
if ($result2->num_rows > 0) {
// output data of each row
while($row = $result2->fetch_assoc()) {
echo '<li>';
echo '<a href="' . $row["link"] . '" class="dropdown-item">' . $row["pagename"] . '</a>';
echo '</li>';
}
} else {
echo "0 results";
}
?>
</ul>
</li>
<?php
if ($result1->num_rows > 0) {
// output data of each row
while($row = $result1->fetch_assoc()) {
echo '<li class="nav-item dropdown active">';
echo '<a href="' . $row["link"] . '" class="nav-link dropdown-toggle animated fadeIn animation-delay-7">' . $row["pagename"] . '</a>';
echo '</li>';
}
} else {
echo "0 results";
}
?>
