php - menu populated from database -
i trying create side navigation populated database. want categories show on left hand side , when click on 1 others slide down make room sub categories. having trouble getting them work properly.
i got main categories , running , got slide down , display subcategory hard coded saying "hello world" trying populate sub categories database having trouble getting work.
here code:
this database connection
<?php $base = ($_server['https'] ? 'https' : 'http') . '://' . $_server['http_host'] . '/'; $mysql_connection = db_connect_enhanced('*********','dbaccess','*******','website'); //connect database $categories = "select * *********** active = 1"; $result = db_query_into_array_enhanced($mysql_connection, $categories); $count = count($result); ?>
here code display navigation
<div id="left-prod-nav"> <ul> <li class="top">product categories</li> <?for($i = 0; $i < $count; $i++) {?> <div class="flip"><li><img src="images/arrowright_off.gif" style="padding:0px; margin:0px;float:right;"><a href="#"><?=$result[$i]['categoryname']?></a></li> </div> <? $subcategories = "select * ************* active = 1"; $subcatresult = db_query_into_array_enhanced($mysql_connection, $subcategories); $subcount = count($subcatresult); for($i = 0; $i < $subcount; $i++) {?> <div class="panel"><?=$subcatresult[$i]['categoryname']?></div> <?}?> <?}?> </ul> <div class="clear"> </div> </div>
here javascript gets navigation slide down , on click
<script> $(document).ready(function(){ $(".flip").click(function(){ $(this).next(".panel").slidetoggle("slow"); }); }); </script>
as said, getting top tier nav work fine. displayed categories database , slid down when clicked. im trying display sub categories when slides down cant.
any appreciated
this happens due several things in code
1.in query , setting
select * ************* active = 1
how differentiate parent category ? check for: returning value ?
2.may css problem too, can check .panel { ... }
in css
3.you closed flip div @ catagory name itself, complete after panel over
<?}?> <?}?> </div> //flip div </ul>
4.pl try plain html , check if works, can confirm , error...is db or jquery :) try this:
<div id="left-prod-nav"> <ul> <li class="top">product categories</li> <div class="flip"><li><img src="images/arrowright_off.gif" style="padding:0px; margin:0px;float:right;"><a href="#">categoryname</a></li> </div> <div class="panel">c1</div> <div class="panel">c2</div> <div class="panel">c3</div> <div class="panel">c4</div> </ul> <div class="clear"></div> </div>
hope helps!
Comments
Post a Comment