GrandadEvans Posts - Answer Overflow

GrandadEvans

•Created by GrandadEvans on 3/5/2024 in #❓┊help

multiple() & searchable() stops Select from working.

Hi Everyone, If I run

namespace App\Livewire;

// use statements omitted for brevity

class AdoptionForm extends Component implements HasForms
{
    use InteractsWithForms;

    protected static string $view = 'livewire.adoption-form';

    public ?Adoption $adoptionForm = null;

    public ?array $data = [];

    public function mount(): void
    {
        $this->adoptableCats = Cat::adoptable()->get()->pluck('name', 'id')->toArray();

        $this->form->fill();
    }


    public function form(Form $form): Form
    {
        return $form->schema([
            Select::make('cats')
                ->options($this->adoptableCats)
        ])->statePath('data')
            ->model($this->adoptionForm);
    }
}

namespace App\Livewire;

// use statements omitted for brevity

class AdoptionForm extends Component implements HasForms
{
    use InteractsWithForms;

    protected static string $view = 'livewire.adoption-form';

    public ?Adoption $adoptionForm = null;

    public ?array $data = [];

    public function mount(): void
    {
        $this->adoptableCats = Cat::adoptable()->get()->pluck('name', 'id')->toArray();

        $this->form->fill();
    }


    public function form(Form $form): Form
    {
        return $form->schema([
            Select::make('cats')
                ->options($this->adoptableCats)
        ])->statePath('data')
            ->model($this->adoptionForm);
    }
}

I get a working select box with cats names.

<select class="fi-select-input py-1.5 --some-classes-omitted-- disabled:[-webkit-text-fill-color:theme(colors.gray.500)] dark:text-white dark:disabled:text-gray-400 dark:disabled:[-webkit-text-fill-color:theme(colors.gray.400)] sm:text-sm sm:leading-6 [&amp;_optgroup]:bg-white [&amp;_optgroup]:dark:bg-gray-900 [&amp;_option]:bg-white [&amp;_option]:dark:bg-gray-900 ps-3" id="data.cats" wire:model="data.cats"><!-- valid options --></select>

<select class="fi-select-input py-1.5 --some-classes-omitted-- disabled:[-webkit-text-fill-color:theme(colors.gray.500)] dark:text-white dark:disabled:text-gray-400 dark:disabled:[-webkit-text-fill-color:theme(colors.gray.400)] sm:text-sm sm:leading-6 [&amp;_optgroup]:bg-white [&amp;_optgroup]:dark:bg-gray-900 [&amp;_option]:bg-white [&amp;_option]:dark:bg-gray-900 ps-3" id="data.cats" wire:model="data.cats"><!-- valid options --></select>

If I go into the devtools and manually add the attribute

multiple="multiple"

multiple="multiple"

then the select becomes a multiple enabled select (not sure if it's the correct format or not, but when I submit the form and dd() from the create method it outputs the multiple selected cat options. However, if I alter the Select call in the form() method, and add either

->multiple()

->multiple()

->searchable()

->searchable()

then I get this element

<select x-ref="input" class="h-9 w-full rounded-lg border-none bg-transparent" id="data.cats" multiple="multiple"></select>

<select x-ref="input" class="h-9 w-full rounded-lg border-none bg-transparent" id="data.cats" multiple="multiple"></select>

with no options visible at all. Is anybody able to help me out with regards to this problem? I've been working on it for 2 days now, but have had no luck except running around in circles.

5 replies

FFilament

•Created by GrandadEvans on 2/12/2024 in #❓┊help

Can I repeat infoList in grid instead of table?

8 replies

FFilament

•Created by GrandadEvans on 2/10/2024 in #❓┊help

Unsure which method to use to show CreateContactForm on url TLD/contact

Hey Everyone, My 1st post here and am quite new to Filament, although I've read docs several times. * I have 2 panels; public (/) & admin (/admin). I've created ContactForm resource to work with the ContactForm model. * If I just fill in a contact form from the admin panel using the CreateContactForm::class, everything works fine. * I also have a custom page 'contact' set up within the 'public' form, so that it appears at /contact * I have a full site working in Laravel/Vue3, but I'm trying to convert it to Filament * I've searched the previous posts but not initially able to find an answer * I'm PHP/Vue is my weapon of choice, but I'm looking at/trying to move from Vue to Livewire (I'm quite new to using Livewire) But, what's the best way to get the get the contact form to display in the /contact page? 1. Is it best to get the form working in the custom contact page using the instructions under Form Builder > Adding a form to a Livewire component 2. Change the url/route of CreateContactForm::class using something like getUrl() 3. Not use Filament for the customer facing public side 4. Anything else you can think of I've tried both 1 & 2, but have run into problems with both of them, so I'm basically looking for advise. A very disjointed post, I appreciate, but any help would be much appreciated. John

4 replies

Gaming

Programming