Undefined variable $services

Tags: , , ,



I have this error. I did this a couple of times on a different pages with different subjects , but with the same method. It always worked. But for some reason now I’m getting this error.

Undefined variable $services (View:Cxampphtdocsaccountingresourcesviewslivewireservice-table.blade.php)

Possible type $services Did you mean $errors?

Web route

//Service Controller
Route::resource('service', ServiceController::class)->middleware('auth');

Model

namespace AppModels;

use IlluminateDatabaseEloquentFactoriesHasFactory;
use IlluminateDatabaseEloquentModel;

class Service extends Model
{
    public $table = 'service';

    use HasFactory;

    protected $fillable = [
        'service_name',
        'service_description',
        'service_cost'
    ];
}

My controller

namespace AppHttpControllers;

use IlluminateHttpRequest;
use AppModelsService;
use IlluminateSupportFacadesDB;

class ServiceController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return IlluminateHttpResponse
     */
    public function index()
    {

        $services = Service::orderBy('id', 'asc')->paginate(5);

        return view('service.index', compact('services'))->with(request()->input('page'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return IlluminateHttpResponse
     */
    public function create()
    {

    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  IlluminateHttpRequest  $request
     * @return IlluminateHttpResponse
     */
    public function store(Request $request)
    {
        //Validate the input
        $request->validate([
            'service_name' => 'required',
            'service_cost' => 'required',
            'service_description' => 'required'
        ]);

        Service::create($request->all());


        return redirect()->route('service.index')->with('success', 'The service was created successfully');

    }

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return IlluminateHttpResponse
     */
    public function show($id)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return IlluminateHttpResponse
     */
    public function edit($id)
    {
        //
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  IlluminateHttpRequest  $request
     * @param  int  $id
     * @return IlluminateHttpResponse
     */
    public function update(Request $request, $id)
    {
        //
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return IlluminateHttpResponse
     */
    public function destroy($id)
    {
        //
    }
}

Livewire table

<div>
    <table class="table table-borderless">
        <thead>
        <tr>
            <th style="width: 5%">Id</th>
            <th style="width: 25%">Service Name</th>
            <th style="width: 20%">Service Cost</th>
            <th style="width: 25%">Service Description</th>
            <th style="width: 10%">EDIT/DELETE</th>
        </tr>
        </thead>
        <tbody>
        @foreach($services as $service)
            <tr>
            <td class="table_row_middle">{{$service->id}}</td>
            <td class="table_row_middle">{{$service->service_name}}</td>
            <td class="table_row_middle">{{$service->service_cost}}</td>
            <td class="table_row_middle">{{$service->service_description}}</td>

            <td>
                <form action="{{route('service.destroy', $service->id)}}" method="post">
                    @csrf
                    @method('DELETE')
                    <div class="flex float-right">
                        <a class="btn btn-primary" style="margin-right: 10px;" href="{{route('service.edit', $service->id)}}">
                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-pencil-square" viewBox="0 0 16 16">
                                <path d="M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456l-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"/>
                                <path fill-rule="evenodd" d="M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z"/>
                            </svg>
                        </a>
                        <button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#delete_service">
                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-earmark-x" viewBox="0 0 16 16">
                                <path d="M6.854 7.146a.5.5 0 1 0-.708.708L7.293 9l-1.147 1.146a.5.5 0 0 0 .708.708L8 9.707l1.146 1.147a.5.5 0 0 0 .708-.708L8.707 9l1.147-1.146a.5.5 0 0 0-.708-.708L8 8.293 6.854 7.146z"/>
                                <path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
                            </svg>
                        </button>

                        <div class="modal" tabindex="-1" id="delete_service">
                            <div class="modal-dialog">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h5 class="modal-title">Delete the service</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body">
                                        <p>Do you want to delete: {{$service->service_name}}</p>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                                        <button type="submit" class="btn btn-danger flex " data-bs-toggle="modal" data-bs-target="#delete_service">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-earmark-x" viewBox="0 0 16 16">
                                                <path d="M6.854 7.146a.5.5 0 1 0-.708.708L7.293 9l-1.147 1.146a.5.5 0 0 0 .708.708L8 9.707l1.146 1.147a.5.5 0 0 0 .708-.708L8.707 9l1.147-1.146a.5.5 0 0 0-.708-.708L8 8.293 6.854 7.146z"/>
                                                <path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/>
                                            </svg>
                                            Delete
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </form>
            </td>
            </tr>
        @endforeach
        </tbody>
    </table>
    <div class="col-md-12 p-2">
        {!! $services->links() !!}
    </div>

</div>

And here is the view

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Services') }}
        </h2>
    </x-slot>

    <div class="container mt-5 p-1" style="max-width: 1280px;">
        <div class="row">
            <div class="col-sm-3 mb-5">
                <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6 bg-white border-b border-gray-200">

                        @if($errors->any())
                            <div class="alert alert-danger" style="margin:1rem;">
                                <ul>
                                    @foreach($errors->all() as $error)
                                        <li>
                                            {{$error}}
                                        </li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif

                        @if($message = Session::get('success'))
                            <div class="alert alert-success" style="margin:1rem;">
                                <p>{{$message}}</p>
                            </div>
                    @endif

                    <!--Add new Client-->
                        <form action="{{route('service.store')}}" method="post">
                            @csrf


                                <div class="col-md-12 p-1">
                                    <label for="serviceName" class="form-label">Service</label>
                                    <input type="text" class="form-control" id="serviceName" name="service_name">
                                </div>
                                <div class="col-md-12 p-1">
                                    <label for="serviceCost" class="form-label">Service Cost (EUR/HOUR)</label>
                                    <input type="text" class="form-control" id="serviceCost" name="service_cost">
                                </div>

                            <div class="col-md-12 p-1">
                                <label for="serviceDescription" class="form-label">Service Description</label>
                                <textarea type="text" rows="3" class="form-control" id="serviceDescription" name="service_description"></textarea>
                            </div>
                            <div class="col-md-12 p-1">
                                <button type="submit" class="btn btn-primary">Add New Service</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

            <div class="col-sm-9">
                <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                    <div class="p-6 bg-white border-b border-gray-200">
                        <livewire:service-table/>
                    </div>
                </div>
            </div>

        </div>
    </div>
</x-app-layout>

Answer

You are sending data to the wrong view. You are sending data to service.index view but trying to get it in livewireservice-table so change the view like below then you can get it.

as the error explains it

Undefined variable $services (View:Cxampphtdocsaccountingresourcesviewslivewireservice-table.blade.php)

the problem is here return view('service.index', compact('services'))->with(request()->input('page'));

Try this

public function index()
    {    
        $services = Service::orderBy('id', 'asc')->paginate(5);    
        return view('livewire.service-table', compact('services'))->with(request()->input('page'));
    }


Source: stackoverflow