Jørgen
Jørgen

Reputation: 3567

Control of active menu items

I'm setting up a small page, so i removed /site/ from the URL. Most pages will be static pages on the site controller, so this looks cleaner.

The menu widget is configured as follows:

$menuItems = [
    ['label' => 'Home', 'url' => ['/']],
    ['label' => 'About', 'url' => ['/about']],
    ['label' => 'Projects', 'url' => ['/projects']],
];

And the config rule is

'rules' => [
    '<controller:\w+>/<id:\d+>' => '<controller>/view',
    '<controller:\w+>/<action:\w+>/<id:\d+>' => '<controller>/<action>',
    '<controller:\w+>/<action:\w+>' => '<controller>/<action>',
    '<action:\w+>' => 'site/<action>',
],

Now my problem is that my menu item links are no longer marked as active (css .active). What controlls this, and how can I change it?

Upvotes: 3

Views: 11989

Answers (5)

Nilesh Patil
Nilesh Patil

Reputation: 138

You can use in_array method to check current URL. In array we need add all urls in which menu is in active state.

'active' => in_array($this->context->route,['items/index','items/create','items/update']),

If we open List page, create page or update page, Item menu will be active.

We can use Controller id to check current controller

'active' => Yii::$app->controller->id == 'items',

Upvotes: 1

Andrea
Andrea

Reputation: 1

Actually, as soovorow suggested, it should work with

$menuItems = [
    ['label' => 'Home', 'url' => ['/']],
    ['label' => 'About', 'url' => ['/site/about']],
    ['label' => 'Projects', 'url' => ['/site/projects']],
];

the problem was that the controlled name was not explicit in

$menuItems = [
    ['label' => 'Home', 'url' => ['/']],
    ['label' => 'About', 'url' => ['/about']],
    ['label' => 'Projects', 'url' => ['/projects']],
];

Upvotes: 0

Dmitry
Dmitry

Reputation: 271

You should to use 'url' => [controller/action] to get this thing done. And this config will be overwrited by you rules. So, and then class .active will be added automatically.

Upvotes: 3

J&#248;rgen
J&#248;rgen

Reputation: 3567

Solved.

Change the menuItems like this

$menuItems = [
    ['label' => 'Home', 'url' => ['/'], 'active' => $this->context->route == 'site/index'],
    ['label' => 'About', 'url' => ['/about'], 'active' => $this->context->route == 'site/about'],
    ['label' => 'Projects', 'url' => ['/projects'], 'active' => $this->context->route == 'site/projects'],
];

Upvotes: 10

Shaig Khaligli
Shaig Khaligli

Reputation: 5515

I use this code in yii2 for best menu:

\yii\widgets\Menu::widget([
    'submenuTemplate' => "\n<ul class='top-nav-menu'>\n{items}\n</ul>\n",
    'activateParents' => false,
    'activeCssClass' => 'active',
    'id' => 'sandwich-menu',
        ['label' => Yii::t('app', 'Education'), 'url' => ['/site/education'] ],
        [
            'label' => Yii::t('app', 'Entertainment'),
            'url' => '#',
            'items' => [
                ['label' => Yii::t('app', 'Games'), 'url' => ['/site/games']],
                ['label' => Yii::t('app', 'Music'), 'url' => ['/site/music'] ],
                ['label' => Yii::t('app', 'Videos'), 'url' => ['/site/videos'] ],
                ['label' => Yii::t('app', 'Chat & Forum'), 'url' => ['/site/forum'] ],
                ['label' => Yii::t('app', 'Clubs'), 'url' => ['/site/clubs'] ]
            ]
        ],
        ['label' => Yii::t('app', 'News'), 'url' => ['/site/news']],
        ['label' => Yii::t('app', 'Contact'), 'url' => ['/site/gencol'] ]
    ]
])

Upvotes: 0

Related Questions