#Custom Field: Using Form Components

6 messages · Page 1 of 1 (latest)

light nova
#

As the title says, i want make use of filament components like a select, inside my custom filament field, how can i achieve that?

i tried using HasForm Contract , and InteractsWithForm but it wasn't successful.

any suggestions?

flat jewelBOT
#

To help others find answers, you can mark your question as solved via Right click solution message -> Apps -> ✅ Mark Solution

crimson tendon
#

If it's a custom field, just extend the original and add whatever custom logic you are using.

light nova
#

i need to have a something like a form, and use a combination of filament form components.

i've succeeded at making what i want, but i'm not sure if it's the right approach.


protected ?ComponentContainer $childComponentContainer = null;

protected function setUp(): void
{
    parent::setUp();
}

public function getChildComponents(): array
{
    if (!$this->childComponentContainer) {
        $this->childComponentContainer = ComponentContainer::make($this->getLivewire())
            ->components($this->getFormSchema());
    }

    return $this->childComponentContainer->getComponents();
}

protected function getFormSchema(): array
{
    return [
        Select::make('type')
            ->options([
                'option1' => 'Option 1',
                'option2' => 'Option 2',
            ])
            ->live()
            ->required()
            ->afterStateUpdated(function () {
                logger()->debug('iiiiii');
            }),

        TextInput::make('value')
            ->required()
            ->maxLength(255),
    ];
}

and in the field view:

<div>
    @foreach($getChildComponents() as $component)
        {{ $component->render() }}
    @endforeach
</div>
blazing echo
light nova
# blazing echo why would you like to add a field inside custom field?

i'm making an invoice page, and in the section where the user should add products i want it to be something like in this image below.

I thought that the default filament repeater wouldn't do it, so i thought of making it a field, since i'll be using it also for quotes, invoices etc.

any better suggestions, i may be taking a wrong path here

image.png