Filament•4mo ago

createOptionUsing on select not called in livewire component

Hey guys, I tried to add a form to a livewire component which works really well. Now I created a select field (Tag) with a relationship with the option to add a new Tag. I created "createOptionForm" on the select which is working fine and I wanted to include a logic, that it returns firstOrCreate on that creation. I added "createOptionUsing" as well, but unfortunately this method is not called somehow. I don't know why this is not working.. :/ Has someone an idea? My code:

class CreateProducts extends Component implements HasForms
{
    use InteractsWithForms;

    public ?array $data = [];

    public function mount(): void
    {
        $this->form->fill();
    }


    public function form(Form $form): Form
    {
        return $form->schema([
            Select::make('tag')
                ->createOptionForm(function () {
                    return [
                        TextInput::make('name')->label('Name')->required(),
                    ];
                })->createOptionUsing(function ($data) {
                    dd($data); // This is never called, instead the form is submitted and the Tag will be created.
                })
                ->preload()
                ->relationship(name: 'tags', titleAttribute: 'name')
                ->multiple(),
        ])
            ->statePath('data')
            ->model(Product::class);
    }

    #[Layout('layouts.app')]
    public function render(): View
    {
        return view('products.create-products');
    }

class CreateProducts extends Component implements HasForms
{
    use InteractsWithForms;

    public ?array $data = [];

    public function mount(): void
    {
        $this->form->fill();
    }


    public function form(Form $form): Form
    {
        return $form->schema([
            Select::make('tag')
                ->createOptionForm(function () {
                    return [
                        TextInput::make('name')->label('Name')->required(),
                    ];
                })->createOptionUsing(function ($data) {
                    dd($data); // This is never called, instead the form is submitted and the Tag will be created.
                })
                ->preload()
                ->relationship(name: 'tags', titleAttribute: 'name')
                ->multiple(),
        ])
            ->statePath('data')
            ->model(Product::class);
    }

    #[Layout('layouts.app')]
    public function render(): View
    {
        return view('products.create-products');
    }

blade:

<div>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Create product') }}
        </h2>
    </x-slot>
    <div>
        <div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">

            <form wire:submit="create">
                {{ $this->form }}
            </form>

            <x-filament-actions::modals />
        </div>
    </div>
</div>

<div>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Create product') }}
        </h2>
    </x-slot>
    <div>
        <div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">

            <form wire:submit="create">
                {{ $this->form }}
            </form>

            <x-filament-actions::modals />
        </div>
    </div>
</div>

Solution:

found the problem: ->relationship has much functions inside - including createOptionUsing, which overwrites my own function. placing "->relationship" on top of "->createOptionUsing" works.. 😄...

Jump to solution

6 Replies

LeandroFerreira•4mo ago

Does the modal open?

d3v1anX•4mo ago

yes, it opens

LeandroFerreira•4mo ago

hum, it is multiple

Solution

d3v1anX•4mo ago

found the problem: ->relationship has much functions inside - including createOptionUsing, which overwrites my own function. placing "->relationship" on top of "->createOptionUsing" works.. 😄

LeandroFerreira•4mo ago

hum, good catch!

d3v1anX•4mo ago

thanks for your trying to help @Leandro Ferreira 🙂

Gaming

Programming

createOptionUsing on select not called in livewire component