Laravel

How to display a multilevel category and subcategory in Laravel – Part2?

In this tutorial of 91 TechSquare, we will learn how to display a multilevel category and subcategory in Laravel. We will use a single table to display a multilevel category and subcategory.

This article is the enhancement of the previous article, in which we learned about how to create a multilevel category and subcategory in Laravel.

We will implement the functionality to display a multilevel category and subcategory with simple steps. Please follow the below steps to accomplish this.

display a multilevel category and subcategory in laravel

1. Create a route to display a multilevel category and subcategory in Laravel:

In this step, we will create a route to display the categories list from the database. This route will handle the request to display a multilevel category and subcategory.

Route::get('categories', [CategoryController::class, 'allCategories'])->name('allCategories');

We used a get route to display all categories list from the database. You can create according to your need as well.

We have already created the CategoryController in the previous article to create a multilevel category and subcategory in Laravel. CategoryController already includes at the top of the route file so do not be confused.

2. Create a method to call our route:

In this step, we will create a method allCategories() to fetch parent categories and render them to view file.

Use the following code into your controller for allCategories route.

public function allCategories()
{
    $categories = Category::where('parent_id', null)->orderby('name', 'asc')->get();
    return view('all-category', compact('categories'));
}

3. Create View for display categories route:

To display multilevel category and subcategory, in this step we will create view files. Here we will create two files for displaying the list of categories, first one is to display parent, and the second one is to display the child categories list in hierarchical order:

Create two blade files as following:

  • views/all-category.blade.php
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<section class="content" style="padding:50px 20%;">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                    <a class="add-new" href="{{Route('createCategory')}}">
                        <button class="btn btn-primary btn-xs">Add New Category</button>
                    </a>
                </div>
                <div class="box-body">
                    <table class="table table-bordered table-striped">
                        <thead>
                        <tr>
                            <th>S.No.</th>
                            <th>Category Name</th>
                            <th>Category Slug</th>
                            <th>Parent Category</th>
                        </tr>
                        </thead>
                        <tbody>
                        @if(isset($categories))
                            <?php $_SESSION['i'] = 0; ?>
                            @foreach($categories as $category)
                                <?php $_SESSION['i']=$_SESSION['i']+1; ?>
                                <tr>
                                    <?php $dash=''; ?>
                                    <td>{{$_SESSION['i']}}</td>
                                    <td>{{$category->name}}</td>
                                     <td>{{$category->slug}}</td>
                                    <td>
                                        @if(isset($category->parent_id))
                                            {{$category->subcategory->name}}
                                        @else
                                            None
                                        @endif
                                    </td>
                                 </tr>
                                 @if(count($category->subcategory))
                                     @include('sub-category-list',['subcategories' => $category->subcategory])
                                 @endif

                            @endforeach
                            <?php unset($_SESSION['i']); ?>
                        @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>

Create another view file to show child categories list in hierarchical order

  • views/sub-category-list.blade.php
<?php $dash.='-- '; ?>
@foreach($subcategories as $subcategory)
    <?php $_SESSION['i']=$_SESSION['i']+1; ?>
    <tr>
        <td>{{$_SESSION['i']}}</td>
        <td>{{$dash}}{{$subcategory->name}}</td>
        <td>{{$subcategory->slug}}</td>
        <td>{{$subcategory->parent->name}}</td>
    </tr>
    @if(count($subcategory->subcategory))
        @include('sub-category-list',['subcategories' => $subcategory->subcategory])
    @endif
@endforeach

We used the session and dash variables to show serial numbers and dashes before the child categories. It is just to get a feel of displaying the list in hierarchical order, so do not get confused.

That’s it, now you can run the project by command php artisan serve, and visit the below route to display a multilevel category and subcategory in Laravel:

http://127.0.0.1:8000/categories

Hopefully, You got an idea about how to display a multilevel category and subcategory using a single table. If you want to know more about this then click on how to edit category and subcategory in Laravel?

91 TechSquare

View Comments

Recent Posts

Top 5 Android Phones in India (2024): OnePlus Open, Samsung Galaxy S24 Ultra & More

Top 5 Android Phones in India Top 5 Android Phones in India for 2024: Unmatched…

2 months ago

Chapter 3: Understanding HTML Headings and Paragraphs

https://www.youtube.com/watch?v=QU0Hm7k_hWI Introduction: Previously, in Chapter 2, we discussed html elements and structure. In this chapter,…

3 months ago

Chapter 2: HTML Elements and Structure

https://youtu.be/HihwZMLuXGY Introduction: Welcome back to our HTML course! In the last chapter, we explored the…

4 months ago

Mastering Laravel Eloquent ORM: Easy Guide for Beginners

Introduction Mastering Laravel Eloquent ORM: Easy Guide for Beginners Laravel, one of the most popular…

4 months ago

Chapter 1: Introduction to HTML Basics

https://youtu.be/nPljiJtfBUQ In this chapter We will understand What HTML Is Understanding What HTML Is: Introduction:…

11 months ago

The SOLID principles: how to use them in Laravel to write better code

The SOLID principles are a set of guidelines for writing clean and maintainable code that…

2 years ago

This website uses cookies.