Modal Sticky Footer livewire component
When I define the 'Generate Presentation' and 'Remove All' buttons in the sticky footer, they do not appear in the slide-over modal.
<?php
<div >
<x-filament::modal slide-over width="4xl" id="product-presentation" sticky-header>
<x-slot name="heading">
Product Presentations
</x-slot>
//Modal Content Code here
<x-filament::modal sticky-footer>
<x-slot name="footerActions">
<button wire:click="openModalOfGeneratePresentation" class="bg-primary-600 dark:bg-white/10 p-2 px-3 font-bold text-white rounded">
Generate Presentation
</button>
<button wire:click="removeProductsConfirmBox" class="bg-white border text-gray-600 dark:bg-white/10 p-2 px-3 font-bold rounded">
Remove All
</button>
<x-filament::modal id="generate-presentation" width="lg">
<x-slot name="heading">
Generate Presentation
</x-slot>
<form wire:submit.prevent="generatePresentation" class="max-w-lg mx-auto">
// Some Code Here
</form>
</x-filament::modal>
<x-filament::modal id="remove-all-products">
<x-slot name="heading">
Remove Products
</x-slot>
<x-slot name="footerActions">
<button wire:click="closeRemoveProductConfirmBox('remove-all-products')">
Cancel
</button>
<button wire:click="removeAllProducts">
Confirm
</button>
</x-slot>
</x-filament::modal>
</x-slot>
</x-filament::modal>
</x-filament::modal>
</div>
?>
<?php
<div >
<x-filament::modal slide-over width="4xl" id="product-presentation" sticky-header>
<x-slot name="heading">
Product Presentations
</x-slot>
//Modal Content Code here
<x-filament::modal sticky-footer>
<x-slot name="footerActions">
<button wire:click="openModalOfGeneratePresentation" class="bg-primary-600 dark:bg-white/10 p-2 px-3 font-bold text-white rounded">
Generate Presentation
</button>
<button wire:click="removeProductsConfirmBox" class="bg-white border text-gray-600 dark:bg-white/10 p-2 px-3 font-bold rounded">
Remove All
</button>
<x-filament::modal id="generate-presentation" width="lg">
<x-slot name="heading">
Generate Presentation
</x-slot>
<form wire:submit.prevent="generatePresentation" class="max-w-lg mx-auto">
// Some Code Here
</form>
</x-filament::modal>
<x-filament::modal id="remove-all-products">
<x-slot name="heading">
Remove Products
</x-slot>
<x-slot name="footerActions">
<button wire:click="closeRemoveProductConfirmBox('remove-all-products')">
Cancel
</button>
<button wire:click="removeAllProducts">
Confirm
</button>
</x-slot>
</x-filament::modal>
</x-slot>
</x-filament::modal>
</x-filament::modal>
</div>
?>

0 Replies