CakePHP selected state for navigation links_问答_开发者

CakePHP selected state for navigation links

开发者 https://www.devze.com 2023-02-20 22:43 出处：网络

I\'m building a portfolio website using CakePHP that has a navigation like so: <nav id=\"nav\"> <ul>

相关专题：cakephp php

I'm building a portfolio website using CakePHP that has a navigation like so:

<nav id="nav">
        <ul>
            <li><?php echo $html->link('Home', '/', array('title' => 'Home')); ?></li>
            <li><?php echo $html->link('Portfolio', '/portfolio', array('title' => 'Portfolio')); ?>
                <ul>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                    <li><?php echo $html->link('Lorem ipsum dolor sit amet, consectetur adipisicing elit', '/portfolio', 开发者_C百科array('title' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit')); ?></li>
                </ul>
            </li>
            <li><?php echo $html->link('About me', '/about', array('title' => 'About me')); ?></li>
        </ul>
    </nav>

However I would like to add a class of selected to the links when a user is on that page OR within the nested page of it. So for example if they were on a portfolio item then BOTH the item link and the portfolio would have class="selected" on the <li>.

Anyone ever done anything like this with CakePHP? Thanks

Instead of adding a "selected" class to the <li>, you might want to add an id attribute on the <body> tag instead. This solution would be easier to cascade for pages within a specific section that may not adhere to a strict, predictable URL pattern. You could have a default for each controller, etc.

This answer explains how to easily add an id attribute to the <body> tag in CakePHP: Add to <body> tag of a cakePHP app

Otherwise, there are a few menu and navigation view helpers floating around. I found this one here: http://www.solitechgmbh.com/2008/06/06/menu-highlighting-with-cakephp-12/

This is a bit of a combination of CakePHP and "normal" html/php, but it works for me in my CakePHP site.

<a href="/portfolio" <? if($this->params['controller'] == "portfolio")
     echo 'class="selected"'; ?>>PORTFOLIO</a>

Or, if you need to check more than just the controller, you can check the action too.

<a href="/pages/about" <? if($this->params['controller'] == "pages"
     && $this->params['action'] == "about")
     echo 'class="selected"'; ?>>ABOUT</a>