2013 年 8 月 28 日

生成与 Twitter Bootstrap 导航子导航兼容的树

我需要一个助手，它可以将我的菜单项显示在 Twitter Bootstrap 导航栏格式中，并且可以无限级。 我首先使用 Google 搜索，但没有结果，或者没有免费的结果。 因此，我将向您展示我是如何做到的。 首先：我的 MenuItems 模型具有简单的字段：id、parent_id、title、link、lft、rght，它使用 Tree（行为）。

所以在使用 find 函数以线程模式获取数据后，我将其传递给助手中的这个小巧长久的函数。

public function renderMenu($array,$root=true,$hasChildren=false) {
    if (count($array)) {
        if ($root)
            echo "\n<ul class=\"nav\">\n";
        else
            if ($hasChildren)
                echo "\n<ul class=\"dropdown-menu\">\n" ;
            else
                echo "\n<ul>\n";
        foreach ($array as $vals) {

            if (count($vals['children']) && (!$hasChildren))
                $liClass="dropdown" ;
            else
                                if ($hasChildren && count($vals['children']))
                                        $liClass = 'dropdown-submenu' ;
                                else
                                        $liClass=null ;


            echo "<li " ;
            if (!is_null($liClass))
                echo 'class="'.$liClass.'"' ;

            echo " id=\"".$vals['MenuItem']['id']."\">".$this->Html->link($vals['MenuItem']['title'],$vals['MenuItem']['link'],array('class'=>'dropdown-toggle', 'data-toggle'=>'dropdown'));
            if (count($vals['children'])) {
                $this->renderMenu($vals['children'],false,true);
            }
            echo "</li>\n";
        }
        echo "</ul>\n";
    }
}

它将打印出与 Bootstrap 导航栏兼容的嵌套 ul li。

此致

作者：cybercoder
归档于：文章、助手
标签：助手、树、bootstrap、助手