Dropdown in yii2 Not working

Question

I'm trying to bring dropdown in my header. Dropdown label coming. But, dropdwon values not coming. What may be the problem ?

<?php

/* @var $this \yii\web\View */
/* @var $content string */

use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\bootstrap\Dropdown;
use yii\widgets\Breadcrumbs;
use app\assets\AppAsset;

AppAsset::register($this);
?>

<div class="wrap">
<?php
    NavBar::begin([
    'brandLabel' => 'My Company',
    'brandUrl' => Yii::$app->homeUrl,
    'options' => [
        'class' => 'navbar-inverse navbar-fixed-top',
    ],
    ]);?>

<?
    echo Nav::widget([
    'options' => ['class' => 'navbar-nav navbar-right'],
    'items' => [
        ['label' => 'Danish Enam', 'url' => ['/site/register']],
        ['label' => 'Dropdown', 'url' => ['#'],
         ['label' => 'DropdownA', 'url' => '/'],
             ['label' => 'DropdownB', 'url' => '#'],
        ],
    ],
    ]);
NavBar::end();
?>

Here is screenshot. You all can clearly see. Dropdown coming in header. Right to 'My Company' Text. But, no values are coming. Not clickable.

Any Idea ?

score 3 · Accepted Answer · answered Sep 24 '15 at 13:39

3

You should simply use another Nav widget instead of Dropdown :

NavBar::begin([
    'brandLabel' => 'My Company',
    'brandUrl' => Yii::$app->homeUrl,
    'options' => [
        'class' => 'navbar-inverse navbar-fixed-top',
    ],
]);

echo Nav::widget([
    'options' => [
        'class' => 'navbar-nav navbar-left',
    ],
    'items' => [
        [
            'label' => 'Dropdown',
            'url' => '#',
            'items' => [
                ['label' => 'DropdownA', 'url' => '/'],
                ['label' => 'DropdownB', 'url' => '#'],
            ],
        ],
    ],
]);

answered Sep 24 '15 at 13:39

soju

25,111
3
68
70

Still DropdownA, DropdwonB values not coming Mr @Soju – Nana Partykar Sep 24 '15 at 13:43
No Error Showing In Console – Nana Partykar Sep 24 '15 at 13:48
It works... Show me your updated code and the output of the Nav widget. – soju Sep 24 '15 at 14:07
Hey @Soju. I Edited My Question. Last Image Is Output. – Nana Partykar Sep 24 '15 at 14:13
Yeah. Updated Mr @Soju. – Nana Partykar Sep 24 '15 at 14:23
Whatever code, you gave me. I Pasted it. echo Nav::widget is there. – Nana Partykar Sep 24 '15 at 14:35
... Well, did you really test my code ?? (and please remove your previous comments) – soju Sep 24 '15 at 15:04
Yes. Same Code I Pasted. And, Tested Too. – Nana Partykar Sep 24 '15 at 15:06

score 1 · Answer 2 · answered Sep 24 '15 at 13:07

1

Please try this code :

echo '<ul id="navbar-id" class="navbar-nav navbar-right nav">';
echo '<li class="dropdown">';
echo '<a href="#" data-toggle="dropdown" class="dropdown-toggle">Label <b class="caret"></b></a>';

echo Dropdown::widget([
    'items' => [
        ['label' => 'DropdownA', 'url' => '/'],
        ['label' => 'DropdownB', 'url' => '#'],
    ],
]);

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

answered Sep 24 '15 at 13:07

Hiren Bhut

1,166
1
13
19

DropdownA, DropdownB values are not coming. Means, not acting as dropdown. Not clickable @Hiren. – Nana Partykar Sep 24 '15 at 13:14

Bloodhound · Answer 3 · 2015-09-30T04:00:07.593

<?php

/* @var $this \yii\web\View */
/* @var $content string */

use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\widgets\Breadcrumbs;
use app\assets\AppAsset;

AppAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?= Html::csrfMetaTags() ?>
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>
<body>
<?php $this->beginBody() ?>

<div class="wrap">
    <?php
    NavBar::begin([
        'brandLabel' => 'My Company',
        'brandUrl' => Yii::$app->homeUrl,
        'options' => [
            'class' => 'navbar-inverse navbar-fixed-top',
        ],
    ]);


    echo Nav::widget([
        'items' => [
            [
                'label' => 'Home',
                'url' => ['site/index'],
                'linkOptions' => ['data-method' => 'post'],
            ],
            [
                'label' => 'Dropdown',
                'items' => [
                     ['label' => 'Level 1 - Dropdown A', 'url' => '#'],
                     '<li class="divider"></li>',

                     ['label' => 'Level 1 - Dropdown B', 'url' => '#'],
                ],
            ],
            [
                'label' => 'Login',
                'url' => ['site/login'],
                'visible' => Yii::$app->user->isGuest
            ],
        ],
        'options' => ['class' =>'nav-pills'], // set this to nav-tab to get tab-styled navigation
    ]);


    NavBar::end();
    ?>

    <div class="container">
        <?= Breadcrumbs::widget([
            'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
        ]) ?>
        <?= $content ?>
    </div>
</div>

<footer class="footer">
    <div class="container">
        <p class="pull-left">&copy; My Company <?= date('Y') ?></p>

        <p class="pull-right"><?= Yii::powered() ?></p>
    </div>
</footer>

<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>

this is an entire layout code. try this layout for any view it will surely work. first name this file header.php(any name is ok) then select the view file for which u want this layout with dropdown.

Still Not working Ajith. Not getting my mistake. I used your code. But, not worked. Is any where i've to include any code ? — Nana Partykar, Sep 29 '15 at 12:35

score 0 · Answer 4 · edited May 23 '17 at 11:52

small error in your code :

NavBar::begin([
'brandLabel' => 'My Company',
'brandUrl' => Yii::$app->homeUrl,
'options' => [
    'class' => 'navbar-inverse navbar-fixed-top',
],
]);


echo Nav::widget([
'options' => ['class' => 'navbar-nav navbar-right'],
'items' => [
    ['label' => 'Danish Enam', 'url' => ['/site/register']],
    ['label' => 'Dropdown',
        'items' => [
            ['label' => 'DropdownA', 'url' => '/'],
            ['label' => 'DropdownB', 'url' => '#'],
        ],
    ],
],
]);

NavBar::end();

Then the bad new, there is a limitation with bootstrap, you can only have 2 levels for the dropdown not 3.

If you want more information take a look there :

Multilevel Boostrap Menu in Yii 2

Dropdown in yii2 Not working

4 Answers4