Laravel 12 E-Commerce Project

Laravel 12 E-Commerce Project - Admin Delete Category


Laravel 12 E-Commerce: Implementing Admin Delete Category

Hi everyone, welcome back to the Laravel E-Commerce Project Tutorial. This video covers the steps for implementing the functionality to delete existing categories in the admin panel, including the necessary controller logic, routing, and a confirmation prompt in the view.


1. Create Delete Logic and Route

Delete Function (`AdminController.php`)

In the `AdminController`, create the `delete_category` function. This function finds the category by ID, checks for and deletes the associated image file from the server, and then deletes the database record. It redirects the user back to the category listing page.

use IlluminateSupportFacadesFile;
public function delete_category($id)
    {
        // Find the category
        $category = Category::find($id);
        // Check if image exists and delete it
        if (File::exists(public_path("uploads/categories")."/".$category->image)) {
            File::delete(public_path("uploads/categories")."/".$category->image);
        }
        // Delete the database record
        $category->delete();
        // Redirect back to the category list
        return redirect()->route("admin.categories");
    }

Define Delete Route (`web.php`)

Create a `DELETE` route for the category deletion logic, passing the category ID as a parameter:

Route::delete("/admin/category/{id}/delete",[AdminController::class,"delete_category"])->name("admin.category.delete’);

2. Update View with Delete Form and Confirmation

Add Delete Form (`categories.blade.php`)

In the `categories.blade.php` view file, locate the table where the categories are listed and replace the static delete link with a form structure that sends a `DELETE` request:

<td>
    <div class="list-icon-function">
        <a href="{{ route("admin.category.edit", ["id" => $category->id]) }}">
            <div class="item edit">
                <i class="fa fa-edit"></i>
            </div>
        </a>
        <form action="{{route("admin.category.delete",["id"=>$category->id])}}" method="POST">
            @csrf
            @method("DELETE")
            <a href="javascript:void(0)" class="item text-danger delete">
                <i class="fa fa-trash"></i>
            </a>
        </form>
    </div>
</td>

Implement SweetAlert Confirmation (JavaScript)

To prevent accidental deletions, add JavaScript using a library like SweetAlert (assuming it'savailable) to display a confirmation dialog when the delete link is clicked. This script will intercept the click, display the alert, and only submit the form if the user confirms.

@push("scripts")
<script>
    $(function() {
        // Event listener for elements with the class ".delete"
        $(".delete").on("click", function(e) {
            e.preventDefault(); // Stop the default action (form submission)
            var form = $(this).closest("form"); // Find the closest parent <form> element
            // Show SweetAlert (sWal) confirmation dialog
            swal({
                title: "Are you sure?",
                text: "You want to delete this record?",
                type: "warning",
                buttons: ["No", "Yes"],
                confirmButtonColor: "#dc3545" // Bootstrap "danger" color
            }).then(function(result) {
                // Handle the user'schoice
                if (result) {
                    form.submit(); // If "Yes" is clicked, submit the form
                }
            });
        });
    });
</script>
@endpush

3. Testing

Navigate to the Admin Categories page, click the Trash icon for a category, and confirm the deletion in the dialog box. The category and its image should be removed, and the page should refresh.

This concludes the implementation of the Admin Delete Category functionality. Thanks for watching this video.

Written by Surfside Media

Senior Full Stack Developer specializing in Web Technologies.