dapelza/eventmap
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Phase 3: Formular zum Anlegen und Bearbeiten

Browse Source 
Neues Modal (js/ui/form.js) mit allen Feldern aus anforderung.md
Abschnitt 6: Name, Kategorie, Kurz-/Volltext-Beschreibung, Adresse, Ort,
Koordinaten, Altersgruppe, Kosten, Oeffnungszeiten, Aufenthaltsdauer,
Ausstattungs-Checkboxen, Indoor/Outdoor, Bild-URL, Website, Tags.

Validierung: Pflichtfelder (Name, Kategorie, Koordinaten), Koordinaten-
Bereichspruefung, Alter min<=max, Bild-/Website-URL nur http/https.
Fehler erscheinen inline je Feld (aria-invalid/aria-describedby), erstes
fehlerhaftes Feld wird fokussiert.

EventMap.ui.openPlaceForm(place) dient als Einstiegspunkt: ohne Argument
zum Neuanlegen, mit Place-Objekt zum Bearbeiten. Speichern aktualisiert
den Store mit neuer Array-Referenz (Karte/Liste reagieren automatisch)
und persistiert nach LocalStorage.

Verdrahtung: neuer "+ Neues Ausflugsziel hinzufuegen"-Button in der
Karten-Toolbar; der bisherige Bearbeiten-Platzhalter in der
Detailansicht (js/ui/detail.js) oeffnet jetzt das Formular vorausgefuellt
mit dem aktuell angezeigten Ausflugsziel.
This commit is contained in:
dapelza
2026-07-24 11:43:01 +02:00
parent 2812e03530
commit 10f9170d61
6 changed files with 809 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+6
View File
@@ -14,6 +14,7 @@
<link rel="stylesheet" href="css/layout.css" />
<link rel="stylesheet" href="css/components.css" />
<link rel="stylesheet" href="css/detail.css" />
<link rel="stylesheet" href="css/form.css" />
<link rel="stylesheet" href="css/responsive.css" />
</head>
<body>
@@ -30,6 +31,9 @@
<button id="locate-btn" type="button" class="btn btn--secondary">
Meinen Standort verwenden
</button>
<button id="add-place-btn" type="button" class="btn btn--primary">
+ Neues Ausflugsziel hinzufügen
</button>
</div>
<div id="map" class="map-panel__map">
<p class="map-panel__loading">Karte wird geladen…</p>
@@ -45,6 +49,7 @@
</main>
<div id="detail-modal" class="detail-modal" hidden></div>
<div id="place-form-modal" class="place-form-modal" hidden></div>
<script src="vendor/leaflet/leaflet.js"></script>
<script src="vendor/leaflet.markercluster/leaflet.markercluster.js"></script>
@@ -69,6 +74,7 @@
<script src="js/map/mapController.js"></script>
<script src="js/ui/list.js"></script>
<script src="js/ui/detail.js"></script>
<script src="js/ui/form.js"></script>
<script src="js/main.js"></script>
</body>
</html>