How to set a data atributte with yii2 menu widget uikit - php

i'm working with yii2 and uikit. i'm trying to build a navbar with the menu widget and i have this:
<nav class='uk-navbar'>
<?php
echo Menu::widget([
'activateItems' => true,
'activateParents' => true,
'activeCssClass' => 'uk-active',
'encodeLabels' => false,
'items' => [
['label' => 'Inicio', 'url' => ['site/index']],
['label' => 'Juridico', 'url' => ['juridico/index']],
['label' => 'Pagos', 'url' => ['pagos/index']],
['label' => 'Universidades', 'url' => ['universidades/index']],
['label' => 'Usuarios', 'url' => ['usuarios/index']],
['label' => 'Planes', 'options' => ['class' => 'uk-parent', 'data' => 'uk-dropdown'], 'url' => ['#'], 'items' => [
['label' => 'Planes Juridico', 'url' => ['#']],
['label' => 'Planes Universidades', 'url' => ['#']],
]],
['label' => 'Login', 'url' => ['site/login'], 'visible' => Yii::$app->user->isGuest],
],
'submenuTemplate' => '<div class="uk-dropdown uk-dropdown-navbar"><ul class="uk-nav uk-nav-navbar">{items}</ul></div>',
'options' => [ 'class' => 'uk-navbar-nav'],
]);
?>
</nav>
all i'm missing is this attribute but i don't know how to set it 'data-uk-dropdown'
i need this result in order to the dropdown to work:
<nav class="uk-navbar">
<ul class="uk-navbar-nav">
<li class="uk-active">Active</li>
<li>Item</li>
<li class="uk-parent" data-uk-dropdown>
Parent
<div class="uk-dropdown uk-dropdown-navbar">
<ul class="uk-nav uk-nav-navbar">
<li>Item</li>
<li>Another item</li>
<li class="uk-nav-header">Header</li>
<li>Item</li>
<li>Another item</li>
<li class="uk-nav-divider"></li>
<li>Separated item</li>
</ul>
</div>
</li>
</ul>
</nav>
Thanks in advance.

have you try to add in the 'options' like below?
<?php
echo Menu::widget([
'activateItems' => true,
'activateParents' => true,
'activeCssClass' => 'uk-active',
'encodeLabels' => false,
'items' => [
['label' => 'Inicio', 'url' => ['site/index']],
['label' => 'Juridico', 'url' => ['juridico/index']],
['label' => 'Pagos', 'url' => ['pagos/index']],
['label' => 'Universidades', 'url' => ['universidades/index']],
['label' => 'Usuarios', 'url' => ['usuarios/index']],
['label' => 'Planes', 'options' => ['class' => 'uk-parent', 'data' => 'uk-dropdown'], 'url' => ['#'], 'items' => [
['label' => 'Planes Juridico', 'url' => ['#']],
['label' => 'Planes Universidades', 'url' => ['#']],
]],
['label' => 'Login', 'url' => ['site/login'], 'visible' => Yii::$app->user->isGuest],
],
'submenuTemplate' => '<div class="uk-dropdown uk-dropdown-navbar"> <ul class="uk-nav uk-nav-navbar">{items}</ul></div>',
'options' => [
'class' => 'uk-navbar-nav',
'data-uk-dropdown' => ''
],
]);
?>

I think this is how you can add data attributes same method would work in other Yii2 places. So you specify the key 'data' and then add an array of just the attribute names (without prefixing them with 'data'. You can read more about it here.
NavBar::begin([
'options' => [
'id' => 'main-nav-bar',
'class' => 'navbar-inverse',
'data' => ['my-attribute' => 'myValue'] // This line specifically.
],
'innerContainerOptions' => ['class' => 'container-fluid']
]);

Related

How can i add title attributes in links using the Yii2 framework?

I created a navigation menu in yii2 and i have links generated by the following code:
<?= HeaderNavigation::widget([
'options' => ['class' => 'nav nav-tabs border-0 flex-column flex-lg-row'],
'itemOptions' => [
'class' => 'nav-item',
],
'items' => [
[
'label' => Yii::t('lang', 'Browse'),
'url' => ['directory/index'],
'icon' => 'home',
'title' => 'HELLO WORLD'
],
],
]) ?>
but title attribute doesn't work. What i m doing wrong??
OK, finally i managed to make it work with the help of Michal Hynčica.
I had to use options key:
'options' => ['title' => 'HELLO WORLD'],
so the code should be:
'items' => [
[
'options' => ['title' => 'HELLO WORLD'],
'label' => Yii::t('lang', 'Browse'),
'url' => ['directory/index'],
'icon' => 'home',
'title' => 'HELLO WORLD'
],

Yii2 - create gridview customizing "model/style" for all gridview and call the style

I have customized my gridview in Yii2 to show columns, headers, and pager in a certain way
'dataProvider' => $dataProvider,
//'filterModel' => $searchModel,
'filterSelector' => 'select[name="per-page"]',
'tableOptions'=> ['class'=>'table datatable-header-footer datatable-header-footer'],
'showFooter' => true,
'layout'=>"{items}\n\n{summary}\n\n<div class='text-right'>{pager}</div>\n",
//'summary' => "{begin} - {end} {count} {totalCount} {page} {pageCount}",
'summary' => " <br/> Affichage de {begin} à {end} des {totalCount} lignes <br/> <br/>",
'formatter' => ['class' => 'yii\i18n\Formatter','nullDisplay' => ' - '],
'pager' => [
'nextPageLabel' => '→',
'prevPageLabel' => '←',
'firstPageLabel' => true,
'maxButtonCount' => 5,
'lastPageLabel' => true
],
'columns' => [
// ['class' => 'yii\grid\SerialColumn'],
//'id', ...
['class' => 'yii\grid\ActionColumn',
'contentOptions' => ['style' => 'width:10%;'],
'header'=>'Actions',
'template' => '{all}',
'buttons' => [
'all' => function ($url, $model, $key) {
return ButtonDropdown::widget([
'encodeLabel' => false,
'label' => 'Choisir',
'dropdown' => [
'encodeLabels' => false,
'items' => [
[
'label' => \Yii::t('yii', '<i class="icon-search4"></i> Details'),
'url' => ['view', 'id' => $key],
],
[
'label' => \Yii::t('yii', '<i class="icon-pencil5"></i> Modifier'),
'url' => ['update', 'id' => $key],
'visible' => true,
],
[
'label' => \Yii::t('yii', '<i class="icon-list"></i> Annonces'),
'url' => ['annonces', 'agence_id' => $key],
'visible' => true,
],
[
'label' => \Yii::t('yii', '<i class="icon-list2"></i> Agents'),
'url' => ['professionnels', 'agence_id' =>$key],
'visible' => true,
],
[
'label' => \Yii::t('yii', '<i class="icon-bin"></i> Supprimer'),
'linkOptions' => [
'data' => [
'method' => 'post',
'confirm' => \Yii::t('yii', 'Are you sure you want to delete this item?'),
],
],
'url' => ['delete', 'id' => $key],
'visible' => true, // same as above
],
],
'options' => [
'class' => 'dropdown-menu-right', // right dropdown
],
],
'options' => [
'class' => 'btn-default',
'style' => 'padding-left: 5px; padding-right: 5px;', // btn-success, btn-info, et cetera
],
'split' => true,
]);
Im wondering if there is a way to create a gridview "style" so I can call and apply this style to every gridview in the project !
Yes, extend GridView class with your own, set all properties, override anything you need and use your class instead of default GridView.

Error Class 'kartik\widgets\SideNav' not found

I have downloaded yii2-widgets-master and don't know where I should keep it.
I am facing the error Class kartik\widgets\SideNav not found.
My code is here
<?php
use yii\helpers\Url;
use kartik\widgets\SideNav;
?>
<div id = "links">
<div class="user-img"><i class="fa fa-user" aria- hidden="true"></i>
<div class="text-center info"> <p>Wecare</p></div>
</div>
<?php
$menuItems[] = ['label' => 'DFenX - Yii2 User - '. Yii::t('app','User Admin Panel'), 'icon' => 'cog', 'url'=>Url::to(['/user/admin/index'])];
$menuItems[] = ['label' => Yii::t('app','Authentication manager'), 'icon' => 'th-list', 'items' => [
['label' => 'Settings', 'icon' => 'th-list', 'items' => [
['label' => '/user/settings', 'url'=>Url::to(['/user/settings'])],
['label' => '/user/settings/profile', 'url'=>Url::to(['/user/settings/profile'])],
['label' => '/user/settings/account', 'url'=>Url::to(['user/settings/account'])],
['label' => '/user/settings/networks', 'url'=>Url::to(['/user/settings/networks'])],
]],
['label' => 'Registration', 'icon' => 'th-list', 'items' => [
['label' => '/user/registration/register', 'url'=>Url::to(['/user/registration/register'])],
['label' => '/user/registration/resend', 'url'=>Url::to(['/user/registration/resend'])],
]],
['label' => 'Security', 'icon' => 'th-list', 'items' => [
['label' => '/user/security/login', 'url'=>Url::to(['/user/security/login'])],
['label' => '/user/security/logout', 'url'=>Url::to(['/user/security/logout'])],
]],
['label' => 'Recovery', 'icon' => 'th-list', 'items' => [
['label' => '/user/recovery/request', 'url'=>Url::to(['/user/recovery/request'])],
['label' => '/user/recovery/reset', 'url'=>Url::to(['/user/recovery/reset'])],
]],
]];
$type = SideNav::TYPE_PRIMARY;
$heading = '<i class="glyphicon glyphicon-user"></i> ' . Yii::t('app','USER Admin - UTILITIES');
echo SideNav::widget([
'type' => $type,
'encodeLabels' => false,
'heading' => $heading,
'items' =>$menuItems,
]);
?>
</div>
Add to composer.json:
"kartik-v/yii2-widget-sidenav": "*"
Run composer update in console under project directory.

YII2: How can I create a link/url in a Menu item to point to an external webpage instead of an action or view of my application

I am using the YII2 Menu Widget and did not find the solution to add attribute options like class , target on created link.
My code is below:
echo Menu::widget(
[
'options' => [
'class' => 'sidebar-menu'
],
'items' => [
[
'label' => Yii::t('backend', 'Admin'),
'url' => Yii::$app->homeUrl,
'icon' => 'fa-list-alt',
'options' => [
'class' => 'treeview',
],
'items' => [
[
'label' => Yii::t('backend', 'External link'),
'url' => 'http://google.com',
'icon' => 'fa-list-alt',
'options' => [
'target' => '_blank',
],
],
]
],
]
]
);
Option target is not added on generated link.
add the target like below through the template setting. The Options you have set in your code are the Html Options of the li element and not the link options.
'items' => [
[
'label' => Yii::t('backend', 'External link'),
'url' => 'http://google.com',
'icon' => 'fa-list-alt',
'template'=> '{label}',
],
]
Suggestions above do not seem to be working (in my case), an alternative solution is:
'linkOptions' => ['target' => '_blank']
For example
[
'url' => \Yii::$app->user->identity->getBlogLink(),
'linkOptions' => ['target' => '_blank'] ,
'label' => \Yii::t('app', 'Blog')
]
If you want to keep the icon in your menu:
'template'=> '{icon}{label}'
As regards the class you must specify it in the options key:
[
'label' => 'Debug',
'icon' => 'fa fa-dashboard',
'url' => ['/debug'],
'options' => ['class' => 'special'],
'template'=> '{icon}{label}',
],
gives the following menu:
<li class="special">
<a target="_blank" href="your_site_url_here/index.php?r=debug">
<i class="fa fa-dashboard"></i>
<span>Debug</span>
</a>
</li>
You can add any url. For Example,
echo Menu::widget([
'items' => [
['label' => 'Home', 'url' => ['http://www.google.com']],
['label' => 'About', 'url' => ['site/about']],
['label' => 'Contact', 'url' => ['site/contact']],
],
'options' => [
'class' => 'navbar-nav nav',
'id'=>'navbar-id',
'style'=>'font-size: 14px;',
'data-tag'=>'yii2-menu',
],
]);

how can I add modal to navbar in yii2 using yii2 -bootstrap extension?

I'm trying to put modal in a navbar in my yii2 project. I'm using yii2-bootstrap extension.
Code for my nav:
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']],
// '<li class="divider"></li>',
// '<li class="dropdown-header">Dropdown Header</li>',
['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();
?>
code for modal:
<?php
Modal::begin([
'header' => '<h2>Hello world</h2>',
'toggleButton' => ['label' => 'click me'],
]);
echo 'Say hello...';
Modal::end();
?>
can anyone please tell me how to add this modal to navbar?
First place the modal with an id on your site/index
<?php
use yii\bootstrap\Modal;
Modal::begin(['id' => 'modal',
'header' => '<h2>Hello world</h2>']);
echo "Say Hello...";
Modal::end();
?>
Then create a jQuery action in your controller/SiteController
function actionShowmodal(){
$js='$("#modal").modal("show")';
$this->getView()->registerJs($js);
return $this->render('index');
}
Finally in views\layouts\main add the link in your 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']],
// '<li class="divider"></li>',
// '<li class="dropdown-header">Dropdown Header</li>',
['label' => 'Cuisines', 'url' => ['/cuisines/index']],
// insert this line
'<li><a data-toggle="modal" data-target="#modal" style="cursor: pointer;">Click me gently!</a></li>',
],
]
];
And for the modal widget:
<?php
Modal::begin([
'header' => '<h2>Hello world</h2>',
'toggleButton' => ['label' => 'click me'],
'id' => 'modal', // <-- insert this modal's ID
]);
echo 'Say hello...';
Modal::end();
?>

Categories