sidebar class="active" and adminLTE.css

Question

sidebar class="active" and adminLTE.css

0ck Oct '15

Created Oct '15	Last Reply Oct '15	Replies 1	Views 5126	Votes 0

0ck 6.3k

Oct '15

Hi,

I'm starting to use Phalcon.php and AdminLTE stylesheet. I'm trying to do an "active" sidebar menu.

i.e : i'm on default view (index on main controller), i load the layout (main) with different elements and the sidebar. When i'm on the index, the button index in my view is set as "active" (bootstrap class) and my button is show as active (nomal). Now i go to an other view, i click on the right button and my active class is remove to the default button (index) instead of my new button link to the right class/controller.

It's a simple bootstrap feature and i used it on other project but i don't know why in phalcon the class is reset. It's like my main layout is refreshed each time i go to an other action instead of just loading the content view. I saw an example with sidebar on an element class and called in layout with {{ elements.MyMethodWhoSetTheSideBar() }}.

So i'm asking if it's a good practice to set a menu or if i'm using wrong layout on phalcon ?

Izo · Answer 1 · 2015-10-05T07:00:08-07:00

i personally do it :

    $active = 0;

    if ($module === 'emailTranslations'){
        $active = 1;
    }

and then

<li class="<?php echo ($active === 0 ? 'active' : null); ?>">
                <a href="/">Home</a>
            </li>
            <li class="<?php echo ($active === 1 ? 'active' : null); ?>">
                <a href="/emailTranslations/list/index">
                    Email Translations
                </a>
            </li>

0ck · Answer 2 · 2015-10-05T07:24:35-07:00

i'm using a similar solution in my project on the element class. Like this : <?php

use Phalcon\Mvc\User\Component;

/**

Elements

Helps to build UI elements for the application */ class Elements extends Component {

private $_sidebarMenu = array( 'index' => array( 'controller' => 'index', 'caption' => 'Dashboard', 'action' => 'index' ), 'Operations' => array( 'caption' => 'Operations', 'sub' => array( 'Payments' => array( 'controller' => 'payments', 'caption' => 'Payments', 'action' => 'index' ), 'Others' => array( 'caption' => 'Others', 'action' => 'index' ), ), ), 'Configuration' => array( 'caption' => 'Configuration', 'sub' => array( 'Points of sale' => array( 'caption' => 'PointsOfSale', 'action' => 'index' ), 'User accounts' => array( 'caption' => 'UserAccounts', 'action' => 'index' ), ), ) );

/**

Builds sidebar menu

@return string */ public function getSidebarMenu($trans) {

$controllerName = $this->view->getControllerName(); $actionName = $this->view->getActionName();

echo '<ul class="sidebar-menu', '">'; foreach ($this->_sidebarMenu as $position => $menu) { if (empty($menu['sub'])){ if ($controllerName == $position) { echo '<li class="treeview active">'; } else { echo '<li class="treeview">'; } echo Phalcon\Tag::linkTo($position, $trans[$menu['caption']]); } else{

    echo '<li class="treeview ">';
    echo Phalcon\Tag::linkTo($position, $trans[$menu['caption']]);
    foreach ($menu['sub'] as $posi => $lol) {
        if($controllerName == $posi){
            echo '<li class="treeview active">';
            echo Phalcon\Tag::linkTo($position, $trans[$menu['caption']]);
            echo '<ul class="treeview-menu menu-open">';
            echo '<li class="active">';
            echo Phalcon\Tag::linkTo($posi.'/'.$lol['action'], $trans[$lol['caption']]);
            echo '</li>';
            echo '</ul>';
        }
        else{
            echo '<ul class="treeview-menu">';
            echo '<li class="">';
            echo Phalcon\Tag::linkTo($posi.'/'.$lol['action'], $trans[$lol['caption']]);
            echo '</li>';
            echo '</ul>';
        }
    }

    /*foreach ($menu['sub'] as $posi => $lol) {
        if($controllerName == $posi){
            echo '<li class="treeview active">';
            echo Phalcon\Tag::linkTo($position, $trans[$menu['caption']]);
            echo '<ul class="treeview-menu active">';
            echo '<li class="active">';
        }
        else{
            echo '<li class="treeview ">';
            echo Phalcon\Tag::linkTo($position, $trans[$menu['caption']]);
            echo '<ul class="treeview-menu">';
            echo '<li class="">';
        }
        echo Phalcon\Tag::linkTo($posi.'/'.$lol['action'], $trans[$lol['caption']]);
        echo '</li>';
        echo '</ul>';
    }*/
}

} echo '</li>'; echo '</ul>'; } };

The problem is i'm checking if the controller is the right one between the $_sidebarMenu array and the action and controller application. So when i'm going to a view the button active is unset cause it's not the right action and controller on the "parent" button.