Filament•3mo ago

Two Livewire Components

Hi everyone, I'm trying to get from one Livewire Component to another (Livewire Events) But getting new value only second time and value is previous selected. Below will describe more. Here is codes... First Component Class

namespace App\Livewire;

use App\Models\Chair;
use Livewire\Component;

class ListFilters extends Component
{

    public $chair;
    public $chairDetails;

    public function mount(): void
    {
        $this->chairDetails = Chair::all();
    }

    public function change()
    {
         $this->dispatch('chairChanged', $this->chair); 
    }

   ....
}

namespace App\Livewire;

use App\Models\Chair;
use Livewire\Component;

class ListFilters extends Component
{

    public $chair;
    public $chairDetails;

    public function mount(): void
    {
        $this->chairDetails = Chair::all();
    }

    public function change()
    {
         $this->dispatch('chairChanged', $this->chair); 
    }

   ....
}

First Component View

<div>
    <x-filament::section icon="heroicon-o-user" icon-color="info">
        <x-slot name="heading">
            User details
        </x-slot>
        <x-slot name="description">
            This is all the information we hold about the user.
        </x-slot>
        <x-filament::input.wrapper>
            <x-filament::input.select wire:model="chair" wire:change="change">
                <option value="*">Select Option</option>
                @foreach ($chairDetails as $chair)
                <option value="{{ $chair->id }}">{{ $chair->name }}</option>
                @endforeach
            </x-filament::input.select>
        </x-filament::input.wrapper>
    </x-filament::section>
</div>

<div>
    <x-filament::section icon="heroicon-o-user" icon-color="info">
        <x-slot name="heading">
            User details
        </x-slot>
        <x-slot name="description">
            This is all the information we hold about the user.
        </x-slot>
        <x-filament::input.wrapper>
            <x-filament::input.select wire:model="chair" wire:change="change">
                <option value="*">Select Option</option>
                @foreach ($chairDetails as $chair)
                <option value="{{ $chair->id }}">{{ $chair->name }}</option>
                @endforeach
            </x-filament::input.select>
        </x-filament::input.wrapper>
    </x-filament::section>
</div>

Second Component Class

    #[On('chairChanged')]
    public function chairChanged($chairId)
    {
        $this->chairId = (int) $chairId;
    }

public function table(Table $table): Table
    {
  dd($this->chairId);
.....

    #[On('chairChanged')]
    public function chairChanged($chairId)
    {
        $this->chairId = (int) $chairId;
    }

public function table(Table $table): Table
    {
  dd($this->chairId);
.....

Second Component View

<x-filament-panels::page>
    <livewire:list-filters />
    @foreach($questionnaires as $questionnaire)
    <livewire:list-reports :questionnaire="$questionnaire->id" :key="$questionnaire->id" />
    @endforeach
</x-filament-panels::page>

<x-filament-panels::page>
    <livewire:list-filters />
    @foreach($questionnaires as $questionnaire)
    <livewire:list-reports :questionnaire="$questionnaire->id" :key="$questionnaire->id" />
    @endforeach
</x-filament-panels::page>

When select First time - get null Second time - get previous selected value How can I fix this? Thanks

1 Reply

Arshavir•3mo ago

Solved adding this line

$this->resetTable();

$this->resetTable();

Gaming

Programming

Two Livewire Components