Table -> Modal -> Filament Table

Hi all I've an interesting issue. I have a filament table with a custom action (opens a modal) on a row:

 Tables\Actions\Action::make('Pallet Labels')
      ->modalContent(fn (DocketPrices $record): View => view('livewire.dockets.pallet-labels.list-pallet-labels-wrapper', ['docket_price' => $record]))

 Tables\Actions\Action::make('Pallet Labels')
      ->modalContent(fn (DocketPrices $record): View => view('livewire.dockets.pallet-labels.list-pallet-labels-wrapper', ['docket_price' => $record]))

I have used ->modalContent to direct to a blade file which calls the livewire component

<livewire:dockets.pallet-labels.list-pallet-labels :docket-price="$docket_price" />

<livewire:dockets.pallet-labels.list-pallet-labels :docket-price="$docket_price" />

On the pallet lables modal, I have another livewire component which is utilising a Filament Table to display associated Pallet Labels. This is working to this point ( I assume this is the best method thus far? ) The issue I have: When I click 'Create Pallet Label' or the Edit button it SHOULD open a SECOND modal, however I get a js error

TypeError: Cannot read properties of undefined (reading 'dispatchEvent')

TypeError: Cannot read properties of undefined (reading 'dispatchEvent')

. If I click the button again it will then load modal and work as intended. I wondered if 1) I am doing this the correct way or 2) ideas on fixing the error so it doesnt require two clicks Thanks everyone.

1 Reply

David | Fortune ValidatorOP•4mo ago

Just found this at the end of previous Help: https://discord.com/channels/883083792112300104/1150945222851825804/1183664327799078962 Added

lazy="on-load"

lazy="on-load"

to the livewire call:

 <livewire:dockets.pallet-labels.list-pallet-labels :docket-price="$docket_price" lazy="on-load" />

 <livewire:dockets.pallet-labels.list-pallet-labels :docket-price="$docket_price" lazy="on-load" />

could do with being in the docs perhaps

Gaming

Programming

Table -> Modal -> Filament Table