Javascript error when opening action

Hey all! I have the following action on a custom page:

    public function getActions(): array
    {
        return [
            Action::make('something')
                ->label('Dag selecteren')
                ->action(function (array $data): void {
                    dd($data);
                })
                ->form([
                    DatePicker::make('date')
                        ->label('Dag')
                        ->required(),
                ])
        ];
    }

    public function getActions(): array
    {
        return [
            Action::make('something')
                ->label('Dag selecteren')
                ->action(function (array $data): void {
                    dd($data);
                })
                ->form([
                    DatePicker::make('date')
                        ->label('Dag')
                        ->required(),
                ])
        ];
    }

When i click on the action nothing happens (except a page refresh?) and i get this error in my console;

index.js:34 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'fingerprint')
    at new Component (index.js:34:40)
    at onNodeAdded (index.js:496:40)
    at callHook (morphdom.js:35:20)
    at handleNodeAdded (morphdom.js:140:13)
    at morphdom.js:407:25
    at morphEl (morphdom.js:219:17)
    at morphdom.js:332:37
    at morphEl (morphdom.js:219:17)
    at morphdom.js:463:13
    at Component.value (index.js:38

index.js:34 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'fingerprint')
    at new Component (index.js:34:40)
    at onNodeAdded (index.js:496:40)
    at callHook (morphdom.js:35:20)
    at handleNodeAdded (morphdom.js:140:13)
    at morphdom.js:407:25
    at morphEl (morphdom.js:219:17)
    at morphdom.js:332:37
    at morphEl (morphdom.js:219:17)
    at morphdom.js:463:13
    at Component.value (index.js:38

Does anyknow what's going on?

3 Replies

DanielvdSpoel•12mo ago

i have this with any action on that page it's a issue with my content 🤔 Page:

<x-filament::page>
    @foreach($times as $time)
        @livewire('show-contracts-for-time', ['time' => $time, 'date' => $date])
    @endforeach
</x-filament::page>

<x-filament::page>
    @foreach($times as $time)
        @livewire('show-contracts-for-time', ['time' => $time, 'date' => $date])
    @endforeach
</x-filament::page>

Live wire component:

<?php

namespace App\Http\Livewire;

use App\Enums\SignatureType;
use App\Models\Order;
use Filament\Tables\Columns\IconColumn;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Concerns\InteractsWithTable;
use Filament\Tables\Contracts\HasTable;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\Model;
use Livewire\Component;

class ShowContractsForTime extends Component /*implements HasTable
{
    use InteractsWithTable;*/
{

    public string $time;
    public string $date;

    public function render()
    {
        return view('livewire.show-contracts-for-time');
    }
}

<?php

namespace App\Http\Livewire;

use App\Enums\SignatureType;
use App\Models\Order;
use Filament\Tables\Columns\IconColumn;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Concerns\InteractsWithTable;
use Filament\Tables\Contracts\HasTable;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\Model;
use Livewire\Component;

class ShowContractsForTime extends Component /*implements HasTable
{
    use InteractsWithTable;*/
{

    public string $time;
    public string $date;

    public function render()
    {
        return view('livewire.show-contracts-for-time');
    }
}

Component view:

<div>
    <h2 class="text-xl font-semibold tracking-tight mb-2">Startijd: {{ $time  }}</h2>
{{--    {{ $this->table }}--}}
</div>

<div>
    <h2 class="text-xl font-semibold tracking-tight mb-2">Startijd: {{ $time  }}</h2>
{{--    {{ $this->table }}--}}
</div>

i'm so confused I'M SO CONFUSED it seems like the loop breaks the whole thing? nvm it caused by another component loading in the loop oh i need a key lol and now the tables don't update 💯

Patrick Boivin•12mo ago

If the tables are in custom components, you'll need to emit a Livewire event from the page to the components to trigger an update

DanielvdSpoel•12mo ago

I ended up just reloading the page, easier for now It was my last day anyway 😂

Gaming

Programming

Javascript error when opening action