Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

beuzathor-20987328's avatar

Use dispatch on custompage with filament 3

Hi, I've created a custom page using Laravel 10 and Filament 3. This page features a button that opens a modal and updates the model. Up to this point, everything works as expected. Once the user confirms the modal and saves the new model, I want to refresh the page or update the content modified by the modal.

The logic involves using ->after to send a dispatch event to update the content, but it doesn't seem to work. The dispatched events I send are not functioning at all.

How can I send an event that refreshes the page after the modal is confirmed?

Custom Page Class (Menu.php): use Illuminate\Http\Request; use Carbon\Carbon; use Carbon\CarbonPeriod; use Filament\Pages\Page; use Filament\Forms\Components; use Filament\Actions\EditAction; use Illuminate\Support\HtmlString;

class Menu extends Page implements HasForms, HasActions { use InteractsWithActions; use InteractsWithForms;

protected static ?string $navigationIcon = 'heroicon-o-document-text';
protected static string $view = 'filament.pages.menu';

public $debutsemaine;
public $finsemaine;
public $dates = [];
public $recettes = [];
public $matinmidisoir;
public $entreeplatdessert;
public $allrecette = [];
public $nbpersonne;
public $recipe;
public $ingredients = [];
public $recettemenu;
public $recettemenus;

public function mount(Request $request)
{
    $next = $request->input('next');
    $last = $request->input('last');
    $datedebut = $request->input('datedebut');

    if (isset($next)) {
        $this->debutsemaine = Carbon::parse($next)->nextWeekday()->format('d-M-y');
        $this->finsemaine = Carbon::parse($this->debutsemaine)->nextWeekday()->endOfWeek()->format('d-M-y');
    } elseif (isset($last)) {
        $this->debutsemaine = Carbon::parse($last)->previous(Carbon::MONDAY)->format('d-M-y');
        $this->finsemaine = Carbon::parse($this->debutsemaine)->endOfWeek()->format('d-M-y');
    } elseif (isset($datedebut)) {
        $this->debutsemaine = Carbon::parse($datedebut)->format('d-M-y');
        $this->finsemaine = Carbon::parse($this->debutsemaine)->endOfWeek()->format('d-M-y');
    } else {
        $this->debutsemaine = Carbon::now()->startOfWeek()->format('d-M-y');
        $this->finsemaine = Carbon::now()->endOfWeek()->format('d-M-y');
    }

    $period = new CarbonPeriod(Carbon::parse($this->debutsemaine), 7);
    foreach ($period as $date) {
        $this->dates[] = $date->format('Y-m-d');
    }

    $this->recettes = Recette::all()->pluck('nomrecette', 'id')->prepend(trans('global.pleaseSelect'), '')->toArray();
    $this->matinmidisoir = [ 'Midi', 'Gouter', 'Soir' ];
    $this->entreeplatdessert = ['Entree' => 'Entree', 'Plat' => 'Plat', 'Dessert' => 'Dessert'];

    $this->recettemenus = RecettesMenu::all()->keyBy('id')->toArray();

    $this->allrecette = RecettesMenu::with('recette')
        ->whereDate('date', '>=', Carbon::parse($this->debutsemaine))
        ->whereDate('date', '<=', Carbon::parse($this->finsemaine))
        ->get()
        ->toArray();
}

protected function getRecettemenu($recettemenuId)
{
    if ($this->recettemenu === null || $this->recettemenu->id !== $recettemenuId) {
        $this->recettemenu = RecettesMenu::where('id', $recettemenuId)->first();
    }
    return $this->recettemenu;
}

public function showmenuAction()
{
    return EditAction::make('showmenu')
        ->after(function ($record) {
            $this->dispatchBrowserEvent('recettemenuUpdated', ['id' => $record->id, 'prixrecette' => '999']);
            $this->dispatchBrowserEvent('post-created', ['title' => 'plop']);
            $this->dispatchBrowserEvent('simple-event', ['message' => 'Hello World']);
        })
        ->link()
        ->color('primary')
        ->record(function(array $arguments) {
            return $this->getRecettemenu($arguments['recettemenu']);
        })
        ->label(function(array $arguments) {
            $recettemenu = $this->getRecettemenu($arguments['recettemenu']);
            return new HtmlString('<span class="text-black text-xs">'. $recettemenu->recette->nomrecette .'</span>');
        })
        ->form([
            Forms\Components\Select::make('recette_id')
                ->relationship(name: 'recette', titleAttribute: 'nomrecette'),
            Forms\Components\TextInput::make('nbpersonne')
                ->required()
                ->numeric(),
            Forms\Components\TextInput::make('prixrecette')
                ->required()
                ->numeric(),
            Forms\Components\Repeater::make('ingredientsRecette')
                ->columns(4)
                ->columnSpan('full')
                ->relationship()
                ->schema([
                    Forms\Components\Select::make('listingredients_id')
                        ->relationship(name: 'listingredients', titleAttribute: 'nomingredient')
                        ->required()
                        ->label('Ingrédient'),
                    Forms\Components\TextInput::make('quantite')
                        ->required()
                        ->numeric()
                        ->label('Quantité'),
                ])
                ->label('Ingredients de la Recette'),
        ]);
}

public function updateNbPersonne($recettemenuId)
{
    $recettemenu = RecettesMenu::find($recettemenuId);
    $recette = Recette::where('id', $recettemenu->recette_id)->first();
    $pricerecette = $this->recettemenus[$recettemenuId]['nbpersonne'] * $recette->countfor_1;

    $recettemenu->prixrecette = number_format($pricerecette, 2);
    $recettemenu->nbpersonne = $this->recettemenus[$recettemenuId]['nbpersonne'];

    $recettemenu->save();

    $this->recettemenus[$recettemenuId]['prixrecette'] = $recettemenu->prixrecette;
}

}

Blade File:

@foreach ($allrecette as $recettemenu) @if ($recettemenu['perioderepas'] == $period && $recettemenu['entreeplatdessert'] == $entreeplatdessertd2 && \Carbon\Carbon::parse($recettemenu['date'])->isSameDay(\Carbon\Carbon::parse($date)))

        <div class="w-full">
            {{ ($this->showmenuAction)(['recettemenu' => $recettemenu['id']]) }}
        </div>

        <div class="w-1/6">
            <input type="text" id="nbpersonnerecette_{{ $recettemenu['id'] }}" name="nbpersonnerepas" class="align-middle  border rounded w-full h-3 p-1.5 text-[12px]" value="{{ $recettemenu['nbpersonne'] }}" wire:model="recettemenus.{{ $recettemenu['id'] }}.nbpersonne" wire:keydown.debounce.500ms="updateNbPersonne({{ $recettemenu['id'] }})">
        </div>

        <div class="w-1/6">
            <input type="text"
                   id="prixrecette_{{ $recettemenu['id'] }}"
                   class="{{ $period }}_{{ \Carbon\Carbon::parse($date)->format('d-m-Y') }} align-middle appearance-none border-none w-full h-3 p-1.5 text-[12px]"
                   wire:model="recettemenus.{{ $recettemenu['id'] }}.prixrecette" value="{{ $recettemenu['prixrecette'] }}€" readonly>
        </div>

    </div>
@endif

@endforeach

and for test if dispatch is ok i have that :

    <script>
        window.livewire.on('priceUpdated', event => {
            document.getElementById(`prixrecette_${event.id}`).textContent = `${event.price}€`;
        });
    </script>



    <script>
        window.livewire.on('post-created', () => {
            console.log('plop');
        });
    </script>
0 likes
0 replies

Please or to participate in this conversation.