Nana Partykar
Nana Partykar

Reputation: 10548

Dropdown in yii2 Not working

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. enter image description here

Any Idea ?

enter image description here

Upvotes: 0

Views: 4580

Answers (4)

Ydakilux
Ydakilux

Reputation: 627

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

Upvotes: 0

Bloodhound
Bloodhound

Reputation: 2966

<?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.

Upvotes: 0

soju
soju

Reputation: 25302

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' => '#'],
            ],
        ],
    ],
]);

Upvotes: 3

Hiren Bhut
Hiren Bhut

Reputation: 1226

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>';

Upvotes: 1

Related Questions