Button with Modal Popup

How to create simple link OR button in Filament livewire which ideally open a Modal popup?

Solution:

```html  <div> <x-filament::modal id="myModal"> <x-slot name="heading">...

Jump to solution

16 Replies

LeandroFerreira•17mo ago

take a look: https://discordapp.com/channels/883083792112300104/1134059696970539018/1134142053639536650 modal window.. what does it mean?

botaviator1990OP•17mo ago

Simple Popup Like Bootstrap Popup window But that's at second stage Currently I'm trying to add a Simple button

LeandroFerreira•17mo ago

are you using filament admin panel?

botaviator1990OP•17mo ago

Yes\ TextInput::make('title')->required(), By doing so, I'm able to creat a text box but in similar way I like to create a button But as far as I considered the documentation I didn't find suitable control in From builder list

LeandroFerreira•17mo ago

there is modal on Filament

botaviator1990OP•17mo ago

Thanks and Yes certainly I may find out a way for adding a Modal But Here my point is how to add Button

Solution

LeandroFerreira•17mo ago

<!-- resources/views/custom-view.blade.php -->
<div>
    <x-filament::modal id="myModal">
        <x-slot name="heading">
            Title
        </x-slot>

        <div>
            Content...
        </div>

        <x-slot name="footer">
            <x-filament::button type="button" @click="$dispatch('close-modal', {id: 'myModal'})">Close</x-filament::button>
        </x-slot>
    </x-filament::modal>

    <x-filament::button type="button" @click="$dispatch('open-modal', {id: 'myModal'})">Open Modal</x-filament::button>
</div>

<!-- resources/views/custom-view.blade.php -->
<div>
    <x-filament::modal id="myModal">
        <x-slot name="heading">
            Title
        </x-slot>

        <div>
            Content...
        </div>

        <x-slot name="footer">
            <x-filament::button type="button" @click="$dispatch('close-modal', {id: 'myModal'})">Close</x-filament::button>
        </x-slot>
    </x-filament::modal>

    <x-filament::button type="button" @click="$dispatch('open-modal', {id: 'myModal'})">Open Modal</x-filament::button>
</div>

Forms\Components\View::make('custom-view')

Forms\Components\View::make('custom-view')

botaviator1990OP•17mo ago

I tried by adding above piece of code but it's showing an error

botaviator1990OP•17mo ago

LeandroFerreira•17mo ago

use Filament\Forms\Components\View;

botaviator1990OP•17mo ago

Already added

LeandroFerreira•17mo ago

share the whole code following #✅┊rules View::make('custom-view') instead of Forms\Components\View::make('custom-view')

botaviator1990OP•17mo ago

Thank you, Its working I need to pass relationship data in custom view, So How can I manage this thing?

LeandroFerreira•17mo ago

$getRecord()

Mark Andrew•17mo ago

@leandro_ferreira , I have a question on this question. Actually, I'm also facing similar issue. But when I try to do this it's saying Relationship doesn't exist. Am i doing anything wrong ?

LeandroFerreira•17mo ago

hey, sorry for the delay. Can you open a new topic and share the code please?

Gaming

Programming

Button with Modal Popup