F
Filament•10mo ago
Vp

Input and dropdown blade component

I am trying to create my custom search, I use Input and dropdown blade components, the problem I face is after search the input field is push over to top, it cannot be visible, how can I prevent input field push over to top 
<div>
    <x-filament::input.wrapper>
        <x-filament::input
            type="search"
            placeholder="Search lyrics"
            wire:model.live="query"
        />
    </x-filament::input.wrapper>

    @if ($query)
        <x-filament::dropdown.list>
            @forelse ($lyrics as $lyric)
                <x-filament::dropdown.list.item
                    class="bg-gray-200 dark:bg-gray-800"
                    href="/hla/{{ $lyric->slug }}"
                    tag="a"
                >
                    {{ $lyric->title }}
                </x-filament::dropdown.list.item>
            @empty
                <x-filament::dropdown.list.item
                    class="bg-gray-200 dark:bg-gray-800"
                >
                    Not found
                </x-filament::dropdown.list.item>
            @endforelse
        </x-filament::dropdown.list>
    @endif
</div>
<div>
    <x-filament::input.wrapper>
        <x-filament::input
            type="search"
            placeholder="Search lyrics"
            wire:model.live="query"
        />
    </x-filament::input.wrapper>

    @if ($query)
        <x-filament::dropdown.list>
            @forelse ($lyrics as $lyric)
                <x-filament::dropdown.list.item
                    class="bg-gray-200 dark:bg-gray-800"
                    href="/hla/{{ $lyric->slug }}"
                    tag="a"
                >
                    {{ $lyric->title }}
                </x-filament::dropdown.list.item>
            @empty
                <x-filament::dropdown.list.item
                    class="bg-gray-200 dark:bg-gray-800"
                >
                    Not found
                </x-filament::dropdown.list.item>
            @endforelse
        </x-filament::dropdown.list>
    @endif
</div>
No description
0 Replies
No replies yetBe the first to reply to this messageJoin
Want results from more Discord servers?
Add your server
More Posts
Class "Filament\Forms\Components\TextArea" not found on productionWhen my application is deployed, I get the `Class "Filament\Forms\Components\TextArea" not found` onCustom livewire in render-hook not workingI create a livewire page `artisan make:livewire test`, and inside test I assign variable like below configure table pagination at service providerat table builder can do ```public function table(Table $table): Table { return $table -Retrieve data in pivot table many to many relationshipSo I have two models Location and Company with many to many relationship, I want to get all the loca