Custom Field that Extends TextInput etc to AutoSave
I am trying somehow to create a parameter i can pass to a textinput that autosaves a field
this is my customclass
I want to add the parameter ->autosave(true) to the field - Something like this
Any hints on how i can use the afterStateUpdated to call this function?
Thanks in advance!!
<?php
namespace App\Forms\Components;
use Filament\Forms\Components\Field;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Contracts\HasForms;
use Illuminate\Database\Eloquent\Model;
class AutoSaveTextInput extends TextInput
{
// ...
protected bool $autoSave = false;
public function autoSave(bool $value = true): static
{
$this->autoSave = $value;
return $this;
}
public static function handleAfterStateUpdated(Field $component, HasForms $livewire, ?Model $record, mixed $state)
{
if (! $record || ! $component->autoSave) {
return; // If there is nowhere to save or autoSave is false, return.
}
$livewire->validateOnly($component->getStatePath());
$record->update([$component->getName() => $state]);
}
}
<?php
namespace App\Forms\Components;
use Filament\Forms\Components\Field;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Contracts\HasForms;
use Illuminate\Database\Eloquent\Model;
class AutoSaveTextInput extends TextInput
{
// ...
protected bool $autoSave = false;
public function autoSave(bool $value = true): static
{
$this->autoSave = $value;
return $this;
}
public static function handleAfterStateUpdated(Field $component, HasForms $livewire, ?Model $record, mixed $state)
{
if (! $record || ! $component->autoSave) {
return; // If there is nowhere to save or autoSave is false, return.
}
$livewire->validateOnly($component->getStatePath());
$record->update([$component->getName() => $state]);
}
}
AutoSaveTextInput::make('name')->autofocus()->required()
->columnSpan(6)
->prefix('Task Name*')
->required()
->label('')
->reactive()
->live(true)
->autoSave(true),
AutoSaveTextInput::make('name')->autofocus()->required()
->columnSpan(6)
->prefix('Task Name*')
->required()
->label('')
->reactive()
->live(true)
->autoSave(true),
Solution:Jump to solution
🙂
```php
$this->afterStateUpdated(fn(
Field $component,
HasForms $livewire,...
7 Replies
you can do it in setUp function
protected function setUp(): void
{
parent::setUp();
$this->afterStateUpdated(function(){
dd(9);
});
}
protected function setUp(): void
{
parent::setUp();
$this->afterStateUpdated(function(){
dd(9);
});
}
sorry not quite sure what you mean? this goes on the clasS?
yes this goes into the
AutoSaveTextInputAhhh
I see what you are up to 😉 one sec
Solution
🙂
$this->afterStateUpdated(fn(
Field $component,
HasForms $livewire,
?Model $record,
mixed $state
) => $this->handleAfterStateUpdated($component, $livewire, $record, $state));
$this->afterStateUpdated(fn(
Field $component,
HasForms $livewire,
?Model $record,
mixed $state
) => $this->handleAfterStateUpdated($component, $livewire, $record, $state));
bloomin awesome! For anyone else this was my final code (probably needs other stuff in it!)
Now i can use
Thanks so much @Lara Zeus
<?php
namespace App\Forms\Components;
use Filament\Forms\Components\Field;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Contracts\HasForms;
use Illuminate\Database\Eloquent\Model;
class AutoSaveTextInput extends TextInput
{
protected bool $autoSave = false;
public function autoSave(bool $value = true): static
{
$this->autoSave = $value;
return $this;
}
public static function handleAfterStateUpdated(Field $component, HasForms $livewire, ?Model $record, mixed $state)
{
if (! $record || ! $component->autoSave) {
return; // If there is nowhere to save or autoSave is false, return.
}
$livewire->validateOnly($component->getStatePath());
$record->update([$component->getName() => $state]);
}
protected function setUp(): void
{
parent::setUp();
$this->afterStateUpdated(fn(
Field $component,
HasForms $livewire,
?Model $record,
mixed $state
) => $this->handleAfterStateUpdated($component, $livewire, $record, $state));
}
}
<?php
namespace App\Forms\Components;
use Filament\Forms\Components\Field;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Contracts\HasForms;
use Illuminate\Database\Eloquent\Model;
class AutoSaveTextInput extends TextInput
{
protected bool $autoSave = false;
public function autoSave(bool $value = true): static
{
$this->autoSave = $value;
return $this;
}
public static function handleAfterStateUpdated(Field $component, HasForms $livewire, ?Model $record, mixed $state)
{
if (! $record || ! $component->autoSave) {
return; // If there is nowhere to save or autoSave is false, return.
}
$livewire->validateOnly($component->getStatePath());
$record->update([$component->getName() => $state]);
}
protected function setUp(): void
{
parent::setUp();
$this->afterStateUpdated(fn(
Field $component,
HasForms $livewire,
?Model $record,
mixed $state
) => $this->handleAfterStateUpdated($component, $livewire, $record, $state));
}
}
AutoSaveTextInput::make('name')->autofocus()->required()
->columnSpan(6)
->prefix('Task Name*')
->required()
->label('')
->reactive()
->live(true)
->autoSave(true),
AutoSaveTextInput::make('name')->autofocus()->required()
->columnSpan(6)
->prefix('Task Name*')
->required()
->label('')
->reactive()
->live(true)
->autoSave(true),
amazing 🙂