Custom input fields not binding to class variables
What I am trying to do:
Hello!
It's my first time using custom field classes in Filament, and I'm running into a problem where the form fields I'm adding to the blade template are not getting bound to the variables in the object.
What I did:
I need a form field where the user can input a time that goes past midnight. Internally that would be for example 25:00, but in the form I want to represent that as 01:00 + 1 day. So what I tried to do is update the state based on the values of the input and select, so that internally it always returns a time.
My issue/the error:
The Filament inputs are not bound to the
$this->timeField and $this->offsetField variables, so the fields never display anything, and updates from the fields are not passed to the class. When I try to print the variables in the Blade template, it gives an undefined variable error.
Code:
https://gist.github.com/phochs/4f5587cab9cc675c7e2a356add438346Gist
Time input with bound inputs
Time input with bound inputs. GitHub Gist: instantly share code, notes, and snippets.
Solution:Jump to solution
This is the basis of how fields work in Filament. Each field is assigned to a public property in the Livewire component class, which is where the state of the field is stored.
5 Replies
Fields aren't Livewire components. The Livewire component is the Page, so those properties would need to exist there.
Hi! That was quick ^^
I was following this page, and there it says that I can bind properties to inputs in the blade template
https://filamentphp.com/docs/3.x/forms/fields/custom#how-fields-work
No. The first part is an explanation of how Livewire works.
The second part says, you need to use
$getStatePath()Solution
This is the basis of how fields work in Filament. Each field is assigned to a public property in the Livewire component class, which is where the state of the field is stored.
I see, thanks! In an earlier version of this input I was using
$getStatePath() and storing both time and offset in there, but then when I retrieved the form value from elsewhere using Get it returned that object. So I guess I'll have to go back to that, but only separate the state in the blade component