如何使用yii2 -bootstrap扩展名将模式添加到yii2中的导航栏?
我正在尝试将模态放在我的yii2项目的导航栏中。 我正在使用yii2-bootstrap扩展。
导航代码:
NavBar::begin([ 'brandLabel' => 'My Company', 'brandUrl' => Yii::$app->homeUrl, 'options' => [ 'class' => 'navbar-inverse navbar-fixed-top', ], ]); $menuItems = [ ['label' => 'Home', 'url' => ['/site/index']], //['label' => 'facilities', 'url' => ['/facilities/index']], ['label' => 'Hotel', 'items' => [ ['label' => 'Facilities', 'url' => ['/facilities/index']], // '', // 'Dropdown Header ', ['label' => 'Cuisines', 'url' => ['/cuisines/index']], ], ] ]; if (Yii::$app->user->isGuest) { $menuItems[] = ['label' => 'Login', 'url' => ['/site/login']]; } else { $menuItems[] = [ 'label' => 'Logout (' . Yii::$app->user->identity->username . ')', 'url' => ['/site/logout'], 'linkOptions' => ['data-method' => 'post'] ]; } echo Nav::widget([ 'options' => ['class' => 'navbar-nav navbar-right'], 'items' => $menuItems, ]); NavBar::end(); ?>
模态代码:
'Hello world
', 'toggleButton' => ['label' => 'click me'], ]); echo 'Say hello...'; Modal::end(); ?>
任何人都可以告诉我如何将此模式添加到导航栏?
首先在您的站点/索引上放置带有id的模态
'modal', 'header' => 'Hello world
']); echo "Say Hello..."; Modal::end(); ?>
然后在您的controller / SiteController中创建一个jQuery操作
function actionShowmodal(){ $js='$("#modal").modal("show")'; $this->getView()->registerJs($js); return $this->render('index'); }
最后在views \ layouts \ main中添加Nav :: wigdet中的链接
['label' => 'Show Modal', 'url' => ['/site/showmodal']],
$menuItems = [ ['label' => 'Home', 'url' => ['/site/index']], //['label' => 'facilities', 'url' => ['/facilities/index']], ['label' => 'Hotel', 'items' => [ ['label' => 'Facilities', 'url' => ['/facilities/index']], // '', // 'Dropdown Header ', ['label' => 'Cuisines', 'url' => ['/cuisines/index']], // insert this line 'Click me gently! ', ], ] ];
对于模态小部件:
'Hello world
', 'toggleButton' => ['label' => 'click me'], 'id' => 'modal', // <-- insert this modal's ID ]); echo 'Say hello...'; Modal::end();
?>