I have categories like this:
I want to create a drop down menu for the categories, which I have successfully created. But the problem is that the child category is also shown as parent category whenever I click on the link.
See the below image:
I want Western
category should appear only when Apparels
category is clicked (which works perfectly fine) and it should not appear when clicked on the Categories
link.
Category Model:
protected $fillable = [
'name', 'parent_id'
];
public function products()
{
return $this->belongsToMany('App\Product')->withTimestamps();
}
public function childs()
{
return $this->hasMany('App\Category', 'parent_id', 'id');
}
In Contoller:
$category = Category::where('parent_id', '!=', '0')->with('childs')->get();
The view:
<li class="dropdown">
<a href="javascript:void(0)" class="dropdown-toggle links-titilium" data-toggle="dropdown" role="button" aria-expanded="false">Categories <span class="caret"></span></a>
<ul class="dropdown-menu multi-level" role="menu">
@foreach( $category as $cat )
<li @if($cat->childs->count()) class="dropdown-submenu" @endif>
<a class="links-titilium" href="{{ url( '/store/category', [$cat->id, Safeurl::make($cat->name)] ) }}" @if( $cat->childs->count() ) class="dropdown-toggle" data-toggle="dropdown" @endif>
{{ $cat->name }}
</a>
@if( $cat->childs->count() )
<ul class="dropdown-menu" role="menu">
<li>
@foreach( $cat->childs as $child )
<a href="{{url('/category', [Safeurl::make($cat->name), Safeurl::make($child->name)])}}">
{{ $child->name }}
</a>
@endforeach
</li>
</ul>
@endif
</li>
@endforeach
</ul>
</li>