首页 > 解决方案 > Yii2 动态超级菜单

问题描述

我正在尝试基于 php(yii2) 和 mysql 数据库创建一个从静态到动态的 Megamenu,但不知何故无法实现。

我正在使用的代码(相关代码)部分:

class MenuHelper
{        
    public static function show_menu(){          
      $menus ='';
      $menus .= static::generate_multilevel_menus();
      $menus = str_replace('<ul class="navbar_nav_inside sub_menu"></ul>', '', $menus);
      return $menus;
}
private static function generate_multilevel_menus($parent_id=NULL){
      $menu='';
      $sql='';
      if(is_null($parent_id) ){
      $sql="SELECT * FROM `menus` WHERE `parent_id` IS NULL ";
      $sql=Menu::find()->where(['parent_id'=>Null])->all();

       }
     else{
          //$sql="SELECT * FROM `menus` WHERE `parent_id`= $parent_id ";    
          $sql=Menu::find()->where(['parent_id'=>$parent_id])->all();

         }
     $rows = $sql;

     // while($row=mysqli_fetch_assoc($result)){
     $count=0;
     foreach($rows as $row){
      if($row['menu_link']) {
         $menu.='<li><a href="'.$row['menu_link'].'">'.$row['menu_name'].'</a>';
         }
         else{
          $menu.='<li><a href="#">'.$row['menu_name'].'</a>';
     }



           $menu.=    '<div class="subnav_wrapper">';
            $menu.=       '<div class="upper_gutter_space"></div>';
            $menu.=       '<div class="subnav_wrapper_inner">';
             $menu.=         '<div class="container">';
              $menu.=            '<div class="row">';
                $menu.=               '<div class="col-sm-2 imgae_holder_sub"></div>';
                  $menu.=             '<div class="col-sm-10  wrapper_navbar_sbmenu">';
                     $menu.=           '<ul class="navbar_nav_inside sub_menu">';

          $menu.='<li>'.static::generate_multilevel_menus($row['id']).'</li>';

         $menu.=              '</ul>';
                    $menu.=        '</div></div></div></div></div>';   


        $menu .= '</li>';

     }
       return $menu;
    }
  }

我得到的html(实际结果):

<div class="container">
<div class="row">
<div class="col-sm-2 imgae_holder_sub"></div>
<div class="col-sm-10  wrapper_navbar_sbmenu">
<ul class="navbar_nav_inside sub_menu">
<li></li><li><a href="#">Vision</a>
<div class="subnav_wrapper">
<div class="upper_gutter_space"></div>
<div class="subnav_wrapper_inner">
<div class="container"><div class="row">
<div class="col-sm-2 imgae_holder_sub"></div>
<div class="col-sm-10  wrapper_navbar_sbmenu">
<ul class="navbar_nav_inside sub_menu">
<li></li></ul></div></div></div></div></div></li>
<li><a href="#">Mission</a>
<div class="subnav_wrapper">
<div class="upper_gutter_space"></div>
<div class="subnav_wrapper_inner">
<div class="container"><div class="row">
<div class="col-sm-2 imgae_holder_sub"></div>
<div class="col-sm-10  wrapper_navbar_sbmenu">
<ul class="navbar_nav_inside sub_menu"><li></li></ul></div></div></div></div></div></li></ul></div></div></div></div></div>

目标html:

<li class=" submenu_li">
    <a href="/academics">Academics</a>  <!-- this is top level menu -->                     
    <div class="subnav_wrapper"><!-- Sub menu main wrapper Starts here===== - -->
        <div class="upper_gutter_space"></div>
    <div class="subnav_wrapper_inner">
    <div class="container">
    <div class="row">
    <div class="col-sm-2 imgae_holder_sub">
    <!--<img src="/images/sub_nav.png" class="img-responsive">-->

    </div>
    <div class="col-sm-10  wrapper_navbar_sbmenu">

        <ul class="  navbar_nav_inside sub_menu ">
    <li><a href="/academics/curriculum">Curriculum </a></li>
        <li><a href="/academics/library">Library</a></li>
        <li><a href="/academics/sba-achievers">IPS Achievers</a></li>
        <li><a href="/academics/laboratories">Laboratories</a></li></ul>

        <ul class="navbar_nav_inside sub_menu ">
                <li><a href="/academics/creative-performing-arts">Performing and Visual Arts</a></li>
                <li><a href="/academics/school-clubs">School Clubs </a></li>
                <li><a href="/academics/career-counselling">Career Counseling</a></li>                                      
            </ul>
    </div>

    </div>

    </div>
    </div>
    </div><!-- Sub menu main wrapper ends  here===-->

    </li>

我正在尝试一个两列的 megamenu,但这里缺少一些重要的步骤。

标签: phpmysqlyii2

解决方案


推荐阅读