0

I have a dynamic menu and sub menu in my website and want to make not clickable menu to only those menu that have sub menu.

here is code

@foreach($levels as $category)
    <li class="text-black-50">
        <a href="/category/{{ $category->slug }}" title=""> 
            {{ $category->name }}
        </a>
    </li>
    @if($category->children->count() > 0 )
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
            <b class="caret"></b>
        </a>
        <ul class="dropdown-menu">
        @foreach($category->children as $child)
        <li>
            <a href="/category/{{ $child->slug }}">{{ $child->name }}</a>
        </li>
        @endforeach
        </ul>
    </li>
    @else
    @endif
@endforeach
linktoahref
  • 7,812
  • 3
  • 29
  • 51
user10927970
  • 1
  • 7
  • as per your code, there are two li for those that have a submenu. So is it correct behavior – Gaurang Ghinaiya Jul 04 '19 at 06:44
  • @GaurangGhinaiya, first li si containing the menu and 2nd li is containing submneu, as also working on website , thanks , I tried with id condition, if($category->count()==1) then {{category->name}} is disabled. else {{$category->name}}, but it's not working – user10927970 Jul 04 '19 at 06:47
  • you need to change HTML structure for submenu. see this link https://stackoverflow.com/questions/38780690/how-to-create-submenu-in-drop-down-html-css – Gaurang Ghinaiya Jul 04 '19 at 06:49
  • but I want to make change through dynamic basis, why should change through html., please suggest – user10927970 Jul 04 '19 at 06:53

1 Answers1

0

I quick solution over your code is don't use href att when the menu has a submenu. Using your code:

@foreach($levels as $category)
    <li class="text-black-50">
        @if($category->children->count() > 0 )
            <a href="/category/{{ $category->slug }}" title=""> 
               {{ $category->name }}
            </a>
        @else
             <a style="pointer-events: none; cursor: default;"> 
                {{ $category->name }}
            </a>
        @endif
    </li>
    @if($category->children->count() > 0 )
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
            <b class="caret"></b>
        </a>
        <ul class="dropdown-menu">
        @foreach($category->children as $child)
        <li>
            <a href="/category/{{ $child->slug }}">{{ $child->name }}</a>
        </li>
        @endforeach
        </ul>
    </li>
    @else
    @endif
@endforeach

I hope It's helps!

Juan José Ruiz Muñoz
  • 32
  • 5