Filament•16mo ago

Modal footer submit

I do have a modal in a view.blade.php file which contains a form and I want to have the submit button in the modal footer (and not within the modal content:

<x-filament::modal slideOver="true">

    <x-slot name="trigger">
        <x-filament::button type="button" x-on:click="isOpen = true">
            Open modal
        </x-filament::button>
    </x-slot>
    
    <form>
        {{-- here are the form fields --}}
    </form>

    <x-slot name="footer">
        <x-filament::button type="submit">
            Submit
        </x-filament::button>
    </x-slot>    
    
</x-filament::modal>

<x-filament::modal slideOver="true">

    <x-slot name="trigger">
        <x-filament::button type="button" x-on:click="isOpen = true">
            Open modal
        </x-filament::button>
    </x-slot>
    
    <form>
        {{-- here are the form fields --}}
    </form>

    <x-slot name="footer">
        <x-filament::button type="submit">
            Submit
        </x-filament::button>
    </x-slot>    
    
</x-filament::modal>

The submit button appears in the modal footer but I could not submit the form. Any ideas how to get submit in modal footer working?

1 Reply

Ilham Dimas Prayudha•16mo ago

Do you want when button (outside the form tag) clicked, it will submit the form? You can add id attribute to your form tag like id="myForm", then you can add form="myForm" attribute to your button tag. Or you want to use wire:click="yourSubmitFunction" on your button if you want to handle it with livewire

Gaming

Programming

Modal footer submit