Livewire:Search with Dynamic Cascading Dropdown -> Undefined variable: event

#1

What seems to be the problem:

Steps to Reproduce:

Are you using the latest version of Livewire:

Do you have any screenshots or code examples:

I have a problem with Dynamic Cascading Dropdown with Livewire. I’m basically creating a table that is filtered based on two parameters:

Component:

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use App\Models\Task;


class Search extends Component
{
    public $instance;
    public $job;
    public $jobs;

    public $tasks;
    public $instances;

    public function mount($instance,$job)
    {
        $this->instance=$instance;
        $this->job=$job;
        $this->tasks=[];
        $this->instances=[];
        $this->jobs=[];

    }

    public function updatedinstance()
    {

        $this->tasks= Task::where('process_status', '=', 'new')
        ->where('id','=', $this->instance)
        ->orderBy('created_at', 'asc')
        ->get()
        ->toArray();

        $this->jobs = Task::where('process_status', '=', 'error')
                        ->orWhere('instance', '=', $this->instance)
                        ->orderBy('created_at', 'asc')->get();
    }

    public function render()
    {
        $this->instances = Task::where('process_status', '=', 'new')->orderBy('created_at', 'asc')->get();
        return view('livewire.search');
    }
}

view:

 <div>
    <div class="mb-8">
        <label class="inline-block w-32 font-bold">Filter:</label>
        <select name="instance" class="border shadow p-2 bg-white" wire:model='instance'
        >
            <option value=''>Choose a Instance</option>
            @foreach($instances as $instance)
                <option value={{ $instance->id }}>{{ $instance->instance }}</option>
            @endforeach
        </select >
        <select name="job" class="border shadow p-2 bg-white" wire:model='job'
        >
            <option value=''>Choose a job</option>
            @foreach($jobs as $job)
                <option value={{ $job->id }}>{{ $job->job }}</option>
            @endforeach
        </select >
        <table class="absolute shadow bg-white top-100 z-40 w-full lef-0 rounded max-h-select overflow-y-auto svelte-5uyqqj">
            <div class="flex flex-col w-full">
                <div class="cursor-pointer w-full border-gray-100 rounded-t border-b hover:bg-teal-100">

            @foreach ($tasks as $task)
            <tr>
                <td>
                     {{ $task['id'] }}
                </td>
                <td>
                {{ $task['instance'] }}
                </td>
                <td>
                  {{ $task['job'] }}
                </td>
            </tr>

            @endforeach
                </div>
            </div>
        </table>

I call the component in the blade view:

<div class="-my-2 py-2 overflow-x-auto sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8">
                        @livewire('search',['instance'=>$event->instance, 'job'=>$event->job])
                    </div>

give me following error:

Undefined variable: event (View: /Users/L8_test/resources/views/test.blade.php)