© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•9mo ago•
3 replies
4Lus

Problem with Livewire/Alpine.js and Leaflet

Hey there, I am trying to build a custom form field to select a route via a Leaflet map and OSRM. So far, I am only trying to get a working component which lets me select one point on a map.
This works well, however I have the problem that as soon as I click save on my form, the map goes blank. The reason for it is that the map container div is reset (since I am guessing that the form is rerendered) and the code, that initializes the leaflet map, is not run again.
Can you help me figure out, how I can manage my map to rerender, properly?

This is my component: https://pastebin.com/eSbE1RiQ
Pastebin
<x-dynamic-component :component="$getFieldWrapperView()" :fie...
Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.
Solution
Solution is: add wire:ignore to the div containing the map-container
Jump to solution
Filament banner
FilamentJoin
A powerful open source UI framework for Laravel • Build and ship admin panels & apps fast with Livewire
20,307Members
Resources

Similar Threads

Was this page helpful?
Recent Announcements

Similar Threads

Problem with JS at livewire
FilamentFFilament / ❓┊help
2y ago
Manually bundling Livewire and Alpine?
FilamentFFilament / ❓┊help
2y ago
Livewire + Alpine optimisation
FilamentFFilament / ❓┊help
3y ago
Problem with livewire
FilamentFFilament / ❓┊help
3y ago