Filament•2y ago

Render form elements based on selection (dynamically)

Hi! I'm using the Form Builder standalone but I have a question regarding rendering. My Livewire component now has this:

// ...
<div class="modal-body">
  {{ $this->form }}
</div>
// ...

// ...
<div class="modal-body">
  {{ $this->form }}
</div>
// ...

My Form schema looks like this:

protected function getFormSchema(): array
    {
        return [
            Select::make('key')
                ->label('Vault type')
                ->options(VaultService::getVaults())
                ->required(),

            // value
        ];
    }

protected function getFormSchema(): array
    {
        return [
            Select::make('key')
                ->label('Vault type')
                ->options(VaultService::getVaults())
                ->required(),

            // value
        ];
    }

But based of the selected vault I want to load a form form the belonging vault class. That whole formset should become value as a array. Please let me know if you need more info

17 Replies

Tin•2y ago

Where is your selected Vault Where do you choose the Vault?

Dennis Koch•2y ago

You are looking for "dependant fields". Check the docs.

HiJoeOP•2y ago

Somewhat depended fields yea but it should not be hooked up in that forms array. Cause this will allow you to essentially add credentials. But I can have 100 providers with different fields So that array will be used. So when x is selected I want to retrieve the fields and add them in the form. Those fields is a Key Value array that makes up the value

Dennis Koch•2y ago

Not sure if this is possible without adding them all into the form and showing/hiding them based on the Select. Maybe use a wizard instead and show them in step2? At some point you need to add it into the form schema.

HiJoeOP•2y ago

Mmm that might be a option. Ill have a look

Dennis Koch•2y ago

I did something similar here with Templates. But it requires all the possible options to be in the form: https://filamentphp.com/tricks/template-based-forms

Filament

Template based forms by Dennis Koch - Tricks - Filament

Filament is a collection of tools for rapidly building beautiful TALL stack apps, designed for humans.

HiJoeOP•2y ago

Ill have a look at that as well thanks for the suggestion 🙂 hopefully I find my best way Love the great support always

Dan Harrin•2y ago

i wrote about this the other day - https://github.com/filamentphp/filament/blob/3.x/packages/forms/docs/08-advanced.md#dynamic-fields-based-on-a-select-option

GitHub

filament/08-advanced.md at 3.x · filamentphp/filament

Admin panel, form builder and table builder for Laravel. Built with the TALL stack. Designed for humans. - filament/08-advanced.md at 3.x · filamentphp/filament

Dan Harrin•2y ago

it'll be in the v3 docs

HiJoeOP•2y ago

mutateFormDataBeforeFill && mutateFormDataBeforeSave Are only in filament admin right? What is the way todo so with forms?

Dan Harrin•2y ago

theres no need outside of the admin as you have full control over the data array before it is saved to the model

HiJoeOP•2y ago

I see but how does it work? Cause I know get

Unable to set component data. Public property [$temp_value] not found on component: [vault.create]

Unable to set component data. Public property [$temp_value] not found on component: [vault.create]

And I do not do anything except dumping

HiJoeOP•2y ago

Maybe I missunderstand something

HiJoeOP•2y ago

Everything in that group should be key-value under the key value

HiJoeOP•2y ago

Nvm, I think I got it now 😄

Dan Harrin•2y ago

$this->form->getState() dont forget $this->form->fill() in mount, it is required.

HiJoeOP•2y ago

I see yea, I'm almost there 😄

Gaming

Programming

Render form elements based on selection (dynamically)