you can write your resources/views/livewire/yourcomponent.blade.php
<div>
<div>
<label for="client-select">Client:</label>
<select id="client-select" wire:model="selectedClient" wire:change="loadEquipments">
<option value="">Select Client</option>
@foreach ($clients as $client)
<option value="{{ $client->id }}">{{ $client->name }}</option>
@endforeach
</select>
</div>
<br><br>
<div>
<label for="equipment-select">Equipment:</label>
<select id="equipment-select" wire:model="selectedEquipment">
<option value="">Select Equipment</option>
@foreach ($equipments as $equipment)
<option value="{{ $equipment->id }}">{{ $equipment->name }}</option>
@endforeach
</select>
</div>
</div>
and for your http/livewire/yourcomponentname.php code as follows:
<?php
namespace App\Livewire;
use App\Models\Client;
use Livewire\Component;
use App\Models\Equipment;
class DependentSelect extends Component
{
public $selectedClient;
public $selectedEquipment;
public function render()
{
$clients = Client::all();
$equipments = Equipment::where('client_id', $this->selectedClient)->get();
return view('livewire.dependent-select', compact('clients', 'equipments'));
}
public function loadEquipments()
{
$this->selectedEquipment = null;
$this->render();
}
}
You can change the variable and components names as per your code and also check that your livewire js and css files are included in the layouts/app.blade.php file.
If you have any issue you can check here the repository i added to github. Repository on github
In my ever-evolving world of web development, delivering smooth and interactive user experiences has become my top priority. As a Laravel enthusiast, I have always appreciated the framework's capabilities in empowering developers like me to create feature-rich applications effortlessly. You can see how to create a dependent dropdown in laravel 10 livewire (https://techsolutionstuff.com/post/laravel-10-livewire-dependent-dropdown)
Sign in to participate in this thread!
The Laravel portal for problem solving, knowledge sharing and community building.
The community