How to make side bar active? - laravel

In below code role row is active but while i click in roles create inside roles page which is not mentioned in the sidebar the column is inactive
image for the create page is https://prnt.sc/qhspxs
image for the index page is https://prnt.sc/qhsq5o
<li class="treeview {{Request::is('admin/administration/*') ? 'active':''}}" >
<a href="#">
<i class="fa fa-user-plus"></i> <span>Administration</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li class="{{'admin/administration/roles' == request()->path() ? 'active' : ''}}"><i class="fa fa-users"></i> Roles</li>
<li class="{{'admin/administration/users' == request()->path() ? 'active' : ''}}"><i class="fa fa-users"></i> Users</li>
<li class="{{'admin/administration/company' == request()->path() ? 'active' : ''}}"><i class="fa fa-users"></i> Companies</li>
</ul>
</li>

You should check if request path is in array of possible routes
Try following code
<li class="treeview {{Request::is('admin/administration/*') ? 'active':''}}" >
<a href="#">
<i class="fa fa-user-plus"></i> <span>Administration</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li class="{{in_array(request()->path(),['admin/administration/roles','admin/administration/roles/create','admin/administration/roles/edit']) ? 'active' : ''}}"><i class="fa fa-users"></i> Roles</li>
<li class="{{'admin/administration/users' == request()->path() ? 'active' : ''}}"><i class="fa fa-users"></i> Users</li>
<li class="{{'admin/administration/company' == request()->path() ? 'active' : ''}}"><i class="fa fa-users"></i> Companies</li>
</ul>
</li>

Get the current route and check if it is equal to the Selected Option:
<li>
Administration
<ul style="<?php if (Request::is('administration/*')) echo "display:block"; ?>">
<li class ="{{ Route::currentRouteNamed('administration.index') ? 'active' : '' }}">
> View Tasks
</li>
</ul>
</li>

Related

Get current slug RouteName in Laravel

I want to change side bar menu to make it open and active when it requested. Here is my code:
<li class="nav-item has-treeview {{Request::is('backend/*') ? 'menu-open':''}}">
<a href="#" class="nav-link {{(request()->segment(1) == 'backend') ? 'active':''}}">
{{$menu->name}}
#if(count($menu->children) > 0)
<i class="fas fa-angle-left right"></i>
#endif
</a>
<ul class="nav nav-treeview #if($menu->parent_id === 0 && count($menu->children) > 0 ) dropdown #endif">
<li class="nav-item has-treeview {{Request::is('backend*') ? 'menu-open':''}}">
#foreach($menu->children as $menu)
<a href="{{ url('backend/'.$menu->slug) }}" class="nav-link {{request()->is('backend/library-setting*') ? 'active':''}}">
{{$menu->name}}
#if (count($menu->children) > 0)
<i class="fas fa-angle-left right"></i>
#endif
</a>
#if(count($menu->children) > 0)
<ul class="#if($menu->parent_id !== 0 && (count($menu->children) > 0)) nav nav-treeview show #endif dropdown" aria-labelledby="dropdownBtn">
#foreach($menu->children as $menu)
<li class="nav-item has-treeview">
<a href="{{ url('backend/'.$menu->slug) }}" class="nav-link {{ Request::is('backend/'.$menu->slug) ? ' active':''}}">
{{$menu->name}}
#if(count($menu->children) > 0)
<i class="fas fa-angle-left right"></i>
#endif
</a>
</li>
#endforeach
</ul>
#endif
#endforeach
</li>
</ul>
</li>
The problem with your code is, You have not mentioned Request::is('backend/*') inside the #if. If you put it inside the #if statement. It will work. Try like below,
<li #if(Request::is('backend/*')) class="active" #endif>
Blog
</li>

Set class on Parent and Sub-Menu in Laravel Bade View

I want to set m-menu__item--open class on parent menu <li> and m-menu__item--active class on sub-menu item <li> in my Laravel bade based on current page. Below is the HTML extracted from the bade template.
<li class="m-menu__item m-menu__item--open" aria-haspopup="true" m-menu-submenu-toggle="hover">
<a href="javascript:;" class="m-menu__link m-menu__toggle">
<i class="m-menu__link-icon flaticon-layers"></i>
<span class="m-menu__link-text">FAQ</span>
<i class="m-menu__ver-arrow la la-angle-right"></i>
</a>
<div class="m-menu__submenu " m-hidden-height="840">
<span class="m-menu__arrow"></span>
<ul class="m-menu__subnav">
<li class="m-menu__item m-menu__item--active" aria-haspopup="true">
<a href="{{ url('/') }}/admin/faq/list/1" class="m-menu__link ">
<i class="m-menu__link-bullet m-menu__link-bullet--dot">
<span></span>
</i>
<span class="m-menu__link-text">English</span>
</a>
</li>
<li class="m-menu__item m-menu__item" aria-haspopup="true">
<a href="{{ url('/') }}/admin/faq/list/2" class="m-menu__link ">
<i class="m-menu__link-bullet m-menu__link-bullet--dot">
<span></span>
</i>
<span class="m-menu__link-text">Korean</span>
</a>
</li>
<li class="m-menu__item m-menu__item" aria-haspopup="true">
<a href="{{ url('/') }}/admin/faq/list/3" class="m-menu__link ">
<i class="m-menu__link-bullet m-menu__link-bullet--dot">
<span></span>
</i>
<span class="m-menu__link-text">Chinese</span>
</a>
</li>
</ul>
</div>
</li>
as I understand, you want to change your menu classes by the current url..
laravel has is() method in Request class. You may want to use it.
class="{{Request::is('category/products') ? 'm-menu__item--active' : 'm-menu__item--open'}}"
if your current url base-url/category/products then you're gonna get the 'm-menu__item--active' class

Laravel HREF techniques for multiple pages

<!-- BEGIN HEADER MENU -->
<div class="nav-collapse collapse navbar-collapse navbar-responsive-collapse">
<ul class="nav navbar-nav">
<li class="dropdown dropdown-fw dropdown-fw-disabled active open selected">
<i class="icon-home"></i> Home
<ul class="dropdown-menu dropdown-menu-fw">
<li>
<i class="icon-bar-chart"></i> View Photo
</li>
<li class="active">
<i class="icon-bulb"></i> About
</li>
<li>
<i class="icon-graph"></i> Contact
</li>
</ul>
</li>
<li class="dropdown dropdown-fw dropdown-fw-disabled">
<i class="icon-home"></i> Upload
<ul class="dropdown-menu dropdown-menu-fw">
<li>
<i class="icon-bar-chart"></i> Upload Photo
</li>
<li>
<i class="icon-bulb"></i> View Photo List
</li>
</ul>
</li>
</ul>
</div>
I am still new to this but basically, I have 5 pages (View Photo, About, Contact, Upload Photo, View Photo List). Currently, I want to show this HTML in all 5 pages so that it will be standardized. If I change the "picture/about" in one page to "photograph/about" for example, the 5 pages will need to reflect this change. This gets more complex as the number of pages increases.
Is there any way or technique in Laravel to solve this issue? Thanks.
Create a template file like Laravel provides app.blade.php in resources/template/ directory, use extends, sections etc for designing, please read Laravel Documentation for Templates
You can use partials for this.
If your issue is adding the active class to the correct link then you can just use request()->is() to check the current url:
<li class="{{ request()->is('picture/externalphotoviewer') ? 'active' : '' }}">
<a href="{{ url('picture/externalphotoviewer') }}">
<i class="icon-bar-chart"></i> View Photo </a>
</li>
<li class="{{ request()->is('picture/about') ? 'active' : '' }}">
<a href="{{ url('picture/about') }}">
<i class="icon-bulb"></i> About </a>
</li>
<li class="{{ request()->is('picture/contact') ? 'active' : '' }}">
<a href="{{ url('picture/contact') }}">
<i class="icon-graph"></i> Contact </a>
</li>
Simply create a blade file inside your resources/views directory and then use #include e.g.
reasources/views/partials/header.blade.php:
<div class="nav-collapse collapse navbar-collapse navbar-responsive-collapse">
<ul class="nav navbar-nav">
<li class="dropdown dropdown-fw dropdown-fw-disabled active open selected">
<a href="javascript:;" class="text-uppercase">
<i class="icon-home"></i> Home </a>
<ul class="dropdown-menu dropdown-menu-fw">
<li class="{{ request()->is('picture/externalphotoviewer') ? 'active' : '' }}">
<a href="{{ url('picture/externalphotoviewer') }}">
<i class="icon-bar-chart"></i> View Photo </a>
</li>
<li class="{{ request()->is('picture/about') ? 'active' : '' }}">
<a href="{{ url('picture/about') }}">
<i class="icon-bulb"></i> About </a>
</li>
<li class="{{ request()->is('picture/contact') ? 'active' : '' }}">
<a href="{{ url('picture/contact') }}">
<i class="icon-graph"></i> Contact </a>
</li>
</ul>
</li>
<li class="dropdown dropdown-fw dropdown-fw-disabled">
<a href="javascript:;" class="text-uppercase">
<i class="icon-home"></i> Upload </a>
<ul class="dropdown-menu dropdown-menu-fw">
<li>
<a href="{{ url('photo/create') }}">
<i class="icon-bar-chart"></i> Upload Photo </a>
</li>
<li>
<a href="{{ url('photo') }}">
<i class="icon-bulb"></i> View Photo List </a>
</li>
</ul>
</li>
</ul>
</div>
Then replace the header code in your other blade files with:
#include('partials.header')
NB
If you change the location of the header you will need to update the #include's as well e.g.
e.g. resources/views/layouts/main/header.blade.php would be #include('layouts.main.header')
Hope this helps!

How to keep navigation menu state between page navigations and refresh

Im using laravel to develop a website. There is a side panel for navigating between the different pages of the website. Some pages are grouped together in an accordion (or dropdown). When I click on one of the options within the accordion it navigates to the page but the accordion closes immediately. How do I keep it open??
here is how the accordion is
<li class="treeview">
<a href="#">
<span>Group of pages</span>
<ul class="treeview-menu"
style="display: none;">
<li>
Page 1
</li>
<li>
Page 2
</li>
</ul>
</li>
Any help is appreciated.
ps. It might be worth it to add that I am using AdminLTE as a template.
Need to add Active class in li
<li class="treeview {{ ((Request::is('a-page')) || (Request::is('a-second-page')) ? 'active' : '') }}">
<a href="#">
<span>Group of pages</span>
<ul class="treeview-menu">
<li class="{{ ((Request::is('a-page')) ? 'active' : '') }}">
Page 1
</li>
<li class="{{ ((Request::is('a-second-page')) ? 'active' : '') }}">
Page 2
</li>
</ul>
</li>
OR
<li class="treeview {{ ((Route::currentRouteName() == 'a-route') || (Route::currentRouteName() == 'a-second-route') ? 'active' : '') }}">
<a href="#">
<span>Group of pages</span>
<ul class="treeview-menu">
<li class="{{ ((Route::currentRouteName() == 'a-route') ? 'active' : '') }}">
Page 1
</li>
<li class="{{ ((Route::currentRouteName() == 'a-second-route') ? 'active' : '') }}">
Page 2
</li>
</ul>
</li>

Laravel 4 base/master view

I've recently gotten some problems. There is an model from which I pull some data and things. There is a menu link that I want to be on every page I enter, so I've put it into the base/master view. But the problem is, I need to enter ->with blabla thing on every public function in every controller. How could I not do that? I mean is there anyway around it? I don't want to do that with thingy on every controller method/function. Here's my code:
#if ( Auth::guest() )
<li style="float: right;padding-right: 0">
<ul class="nav">
<li>
<a href="{{ URL::to('register') }}">
<i class="icon-black icon-plus">
</i>
<strong>
Register
</strong>
</a>
</li>
<li>
<a href="{{ URL::to('login') }}">
<i class="icon-black icon-lock">
</i>
<strong>
Log in
</strong>
</a>
</li>
</li>
</li>
</ul>
#else
<li class="divider-vertical">
</li>
<li style="float: right;padding-right: 0">
<div class="btn-group">
<div class="btn btn-primary">
<i class="icon-user">
</i>
{{ (Auth::user()->name) }}
</div>
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
<span class="icon-caret-down">
</span>
</a>
<ul class="dropdown-menu">
<li>
<a href="{{ URL::to('account/managment') }}">
<i class="icon-user">
</i>
Account Managment
</a>
</li>
<li>
<a href="{{ URL::to('account/managment/change_credentials') }}">
<i class="icon-lock">
</i>
Change Password
</a>
</li>
<li class="divider">
</li>
<li>
<a href="{{ URL::to('account/logout') }}">
<i class="icon-off">
</i>
Log out
</a>
</li>
</ul>
</div>
#endif
You can define a View Composer :
View::composer(array('your.first.view','your.second.view'), function($view)
{
$view->with('count', User::count());
});
Everytime you call your view, a user count will be bound to it automatically.
Edit:
About where to use it, it's up to you and it depends on your app, but you might use pp/start/global.php if you don't have a better place to put it. It just have to be executed before your those views.
#Antonio's answer is a good way to do this. You can also use View::share(); to accomplish this with a shorter code.
View::share(array(
'foo' => 'bar'
));

Resources