Filament•10mo ago

Update field state from alpine

Is there a way of setting the wire state from alpine? E.g here the state remains the one step behind the last letter is capital.

Forms\Components\TextInput::make('group')
    ->extraAlpineAttributes([
        'x-on:keyup' => <<<'JS'
            $event.target.value = $event.target.value.toLowerCase()
        JS
    ])
    ->rules(['lowercase'])

    // Test code to show what's happening
    ->helperText(fn ($state) => $state)
    ->reactive()

Forms\Components\TextInput::make('group')
    ->extraAlpineAttributes([
        'x-on:keyup' => <<<'JS'
            $event.target.value = $event.target.value.toLowerCase()
        JS
    ])
    ->rules(['lowercase'])

    // Test code to show what's happening
    ->helperText(fn ($state) => $state)
    ->reactive()

I know I can do all this easily with formatStateUsing but I need it to be instant

Solution:

Cheers yeah that work ```php ->extraAlpineAttributes(fn (Forms\Components\TextInput $component): array => [ 'x-on:keyup' => <<<JS $event.target.value = $event.target.value.toLowerCase();...

Jump to solution

2 Replies

awcodes•10mo ago

$wire.set() Might be $wire.$set() can never remember

Solution

gizmojo•10mo ago

Cheers yeah that work

->extraAlpineAttributes(fn (Forms\Components\TextInput $component): array => [
    'x-on:keyup' => <<<JS
        \$event.target.value = \$event.target.value.toLowerCase();
        \$wire.\$set('{$component->getStatePath(true)}', \$event.target.value)
    JS
])

->extraAlpineAttributes(fn (Forms\Components\TextInput $component): array => [
    'x-on:keyup' => <<<JS
        \$event.target.value = \$event.target.value.toLowerCase();
        \$wire.\$set('{$component->getStatePath(true)}', \$event.target.value)
    JS
])

Gaming

Programming

Update field state from alpine