Action in custom page

Hello, Have a simple button in blade view

<x-filament::button wire:click="challenge" class="primary-bg">
   Challenge
</x-filament::button>

<x-filament::button wire:click="challenge" class="primary-bg">
   Challenge
</x-filament::button>

in my custom page, function challenge() call an action

   //Challenge
    public function challenge()
    {   
        Action::make('sendEmail')
            ->form([
                TextInput::make('subject')->required(),
                RichEditor::make('body')->required(),
            ])
            ->action(function (array $data) {
                Mail::to($this->client)
                    ->send(new GenericEmail(
                        subject: $data['subject'],
                        body: $data['body'],
                    ));
            });
    }

   //Challenge
    public function challenge()
    {   
        Action::make('sendEmail')
            ->form([
                TextInput::make('subject')->required(),
                RichEditor::make('body')->required(),
            ])
            ->action(function (array $data) {
                Mail::to($this->client)
                    ->send(new GenericEmail(
                        subject: $data['subject'],
                        body: $data['body'],
                    ));
            });
    }

when try to click button get error Method Filament\Notifications\Actions\Action::form does not exist. any suggest? thanks

Solution:

The action name should match the function name

Jump to solution

14 Replies

Lara Zeus•2mo ago

it should be like:

{{ $this->challengeAction }}

{{ $this->challengeAction }}

and change the method name: challengeAction for more: https://filamentphp.com/docs/3.x/actions/adding-an-action-to-a-livewire-component#adding-the-action

ZoltarOP•2mo ago

try @Lara Zeus i create the component

namespace App\Livewire;

use Livewire\Component;

use Filament\Actions\Action;
use Filament\Actions\Concerns\InteractsWithActions;
use Filament\Actions\Contracts\HasActions;
use Filament\Forms\Concerns\InteractsWithForms;
use Filament\Forms\Contracts\HasForms;

use Filament\Forms\Components\RichEditor;
use Filament\Forms\Components\TextInput;
use Illuminate\Support\Facades\Mail;

class ChallengeButton extends Component implements HasForms, HasActions
{

    use InteractsWithActions;
    use InteractsWithForms;
    
    public function render()
    {
        return view('livewire.challenge-button');
    }

    public function challengeAction(): Action
    {
        return Action::make('sendEmail')
            ->form([
                TextInput::make('subject')->required(),
                RichEditor::make('body')->required(),
            ])
            ->action(function (array $data) {
                Mail::to($this->client)
                    ->send(new GenericEmail(
                        subject: $data['subject'],
                        body: $data['body'],
                    ));
            });
    }
}

namespace App\Livewire;

use Livewire\Component;

use Filament\Actions\Action;
use Filament\Actions\Concerns\InteractsWithActions;
use Filament\Actions\Contracts\HasActions;
use Filament\Forms\Concerns\InteractsWithForms;
use Filament\Forms\Contracts\HasForms;

use Filament\Forms\Components\RichEditor;
use Filament\Forms\Components\TextInput;
use Illuminate\Support\Facades\Mail;

class ChallengeButton extends Component implements HasForms, HasActions
{

    use InteractsWithActions;
    use InteractsWithForms;
    
    public function render()
    {
        return view('livewire.challenge-button');
    }

    public function challengeAction(): Action
    {
        return Action::make('sendEmail')
            ->form([
                TextInput::make('subject')->required(),
                RichEditor::make('body')->required(),
            ])
            ->action(function (array $data) {
                Mail::to($this->client)
                    ->send(new GenericEmail(
                        subject: $data['subject'],
                        body: $data['body'],
                    ));
            });
    }
}

create the view

<div>
    {{-- Success is as dangerous as failure. --}}
    {{ $this->challengeAction }}
    <x-filament-actions::modals />
</div>

<div>
    {{-- Success is as dangerous as failure. --}}
    {{ $this->challengeAction }}
    <x-filament-actions::modals />
</div>

i add the component to my custom page

@livewire('challenge-button')

@livewire('challenge-button')

i have no error but when i click on the button nothing happens any suggest?

Lara Zeus•2mo ago

did you add: <x-filament-actions::modals />

ZoltarOP•2mo ago

in the component need to add in the page?

Lara Zeus•2mo ago

try add it to the page 🙂 also see if there is any console error in the dev tools

ZoltarOP•2mo ago

add in the page and not work...no error man nothing

ZoltarOP•2mo ago

message.txt

ZoltarOP•2mo ago

this is the message in the console

Lara Zeus•2mo ago

it has to be something related to the names try change sendEmail to challenge

Solution

ChesterS•2mo ago

The action name should match the function name

ZoltarOP•2mo ago

LOVE YOU thanksssssssss

Lara Zeus•2mo ago

🎉

ZoltarOP•2mo ago

very very thanks mate

Lara Zeus•2mo ago

anytime 🙂

Gaming

Programming

Action in custom page