Not working with wire:navigate

[QualityCodeSA]

Bootstrapt modal working fine when first time open page with refresh but in livewire 3 not working when come back from other page (usinf wire:navigate) and open modal

[aliqasemzadeh]

yes,
I know some problem and I am working hard on it.

[QualityCodeSA]

yes, I know some problem and I am working hard on it.

Thank you brother. Update me once finish so I will apply changes

[aliqasemzadeh]

Check note and update.
I hope this update help me and then let me know.

[QualityCodeSA]

@aliqasemzadeh any update regarding not working with wire:navigate ?

[aliqasemzadeh]

@QualityCodeSA
No it doesn't work.
I think we need trait to dispatch modals to solve this problem.

[aliqasemzadeh]

@QualityCodeSA
Trait doesn't work.

[QualityCodeSA]

@aliqasemzadeh any possibility to work or not?

[aliqasemzadeh]

@QualityCodeSA
It looks like there is no solution a the moment.

[mozhuilungdsuo]

I think we need to persist the livewire modal? @persist('modals')

<livewire-modals

@endpersist
@aliqasemzadeh @QualityCodeSA

[aliqasemzadeh]

@mozhuilungdsuo
Please give us example.

[mozhuilungdsuo]

as per the documentation a
<a href="/users" wire:navigate>Users</a>
requests the page in the background and replaces the current page. So the livewire modal component ie
<livewire:modals/> we put in the app layout view would show the old livewire component and since we added a new livewire component itll give issue ( thats what i assume). so as per the documentation herehttps://livewire.laravel.com/docs/navigate

we should be keeping this in the app layout view. @persist('player') <livewire:modals/> @endpersist
I maybe wrong but this should ideally fix it.

[hozzaq]

@mozhuilungdsuo yeah persist works, another issue i found is modal-backdrop not being created so the solution i found is to add event listener for livewire:navigated and dispose the old modal
document.addEventListener("livewire:navigated", () => { let modal = Modal.getInstance(modalsElement); if (modal) { modal.dispose(); } });