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•3w 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

Zoltar•3w 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•3w ago

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

Zoltar•3w ago

in the component need to add in the page?

Lara Zeus•3w ago

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

Zoltar•3w ago

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

Zoltar•3w ago

message.txt

Zoltar•3w ago

this is the message in the console

Lara Zeus•3w ago

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

Solution

ChesterS•3w ago

The action name should match the function name

Zoltar•3w ago

LOVE YOU thanksssssssss

Lara Zeus•3w ago

🎉

Zoltar•3w ago

very very thanks mate

Lara Zeus•3w ago

anytime 🙂

Gaming

Programming

Action in custom page