Download 1.12.2

Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

Seiten: 1

#1 04. September 2020 12:15

Janl
Server-Pate
Ort: Freistadt, Österreich
Registriert: 13. Dezember 2010
Beiträge: 1.231
Webseite

Smarty Logik in Javascript in Template

Hallo,

ich suche schon einige Stunden nach einer Lösung für folgendes:

In Lise will ich ein Template machen die in ein OSM-Plan alle Entries ein Marker gibt.

Dazu soll in das Leaflet-javascript ein (smarty-)foreach-Schleife laufen.

 Hier klicken, um den Code zum Kopieren zu markieren
[== html ==]
{foreach from=$items item=item}

	L.marker([{$item->Lat}, {$item->Lon}).addTo(mymap)
		.bindPopup("<b><a href='{$item->url}'>{$item->name}</a><br />{$item->adresse}<br />4261 Rainbach<br />Tel.: {$item->telefon}</b>").;
	var popup = L.popup();

{/foreach}

Ich habe vieles versucht mit {literal}{/literal} oder mit {ldelim}{rdelim}
aber ohne Resultat.
Ist das überhaupt möglich? In der Smarty-Site behaupt man es ist möglich.

MfG
Jan

Kubuntu 22.04 - Win 11 pro / Kubuntu 20.04  - win10 pro

Offline

#2 04. September 2020 13:11

nockenfell
Moderator
Ort: Gontenschwil, Schweiz
Registriert: 09. November 2010
Beiträge: 2.931
Webseite

Re: Smarty Logik in Javascript in Template

Das müsste eigentlich schon funktionieren. Im JavaScript Code hast du soweit ich sehe ja keine geschweiften Klammern welche mit Literal ausgeschlossen werden müssten.

Was ist den das Resultat? Wird das Javascript so generiert wie du es denkst oder was kommt raus?

[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox

Offline

#3 04. September 2020 14:34

Janl
Server-Pate
Ort: Freistadt, Österreich
Registriert: 13. Dezember 2010
Beiträge: 1.231
Webseite

Re: Smarty Logik in Javascript in Template

Hallo Nockenfell,

Seitenquelltext zeigt:

 Hier klicken, um den Code zum Kopieren zu markieren
[== html ==]
{foreach from=$items item=item}

	L.marker([{$item->Lat}, {$item->Lon}).addTo(mymap)
		.bindPopup("<b><a href='{$item->url}'>{$item->name}</a><br />{$item->adresse}<br />4261 Rainbach<br />Tel.: {$item->telefon}</b>").;
	var popup = L.popup();

{/foreach}

Der komplette Kode ist eigentlich nur das komplette Leaflet-Script um ein Marker zu setzen.
Schaut so aus:

 Hier klicken, um den Code zum Kopieren zu markieren
[== html ==]
<div id='mapid' style='width:95%;height:600px;'></div>
{literal}
<script type="text/javascript">// <![CDATA[
	var mymap = L.map('mapid').setView([48.55886, 14.47653], 13);

	L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
		maxZoom: 18,
		attribution: 'Map data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors, ' +
			'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
			'Imagery © <a href="https://mapbox.com">Mapbox</a>',
		id: 'mapbox.streets'
	}).addTo(mymap);


{foreach from=$items item=item}

	L.marker([{$item->Lat}, {$item->Lon}).addTo(mymap)
		.bindPopup("<b><a href='{$item->url}'>{$item->name}</a><br />{$item->adresse}<br />4261 Rainbach<br />Tel.: {$item->telefon}</b>").;
	var popup = L.popup();

{/foreach}



	function onMapClick(e) {
		popup
			.setLatLng(e.latlng)
			.setContent("You clicked the map at " + e.latlng.toString())
			.openOn(mymap);
	}
	mymap.on('click', onMapClick);
// ]]></script>
{/literal}

Wenn ich stat $item->field reale Werte für Lon/Lat etc. da gebe funktioniert es normal.

Ich habe schon viel in Internet gefunden aber nicht wie eine Smarty-Schleife (foreach) innerhalb Javascript funktioniert.

Ich habe die Felder zwischen {/literal}{literal} gegeben ohne Resulat, immer ein leere div.
Mir ist nicht klar ob und wie {foreach} und {if} betroffen sind.
Weiter habe ich noch {$item->field|escape:javascript} aber mit immer dasselbe, leere div.

Deswegen poste ich irgendwie stehe ich auf dem Schlauch . . .

MfG
Jan

Kubuntu 22.04 - Win 11 pro / Kubuntu 20.04  - win10 pro

Offline

#4 04. September 2020 14:39

nockenfell
Moderator
Ort: Gontenschwil, Schweiz
Registriert: 09. November 2010
Beiträge: 2.931
Webseite

Re: Smarty Logik in Javascript in Template

Wenn dann müsste der Code so sein:

 Hier klicken, um den Code zum Kopieren zu markieren
[== html ==]
<div id='mapid' style='width:95%;height:600px;'></div>
{literal}
<script type="text/javascript">// <![CDATA[
	var mymap = L.map('mapid').setView([48.55886, 14.47653], 13);

	L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
		maxZoom: 18,
		attribution: 'Map data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors, ' +
			'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
			'Imagery © <a href="https://mapbox.com">Mapbox</a>',
		id: 'mapbox.streets'
	}).addTo(mymap);

{/literal}
{foreach from=$items item=item}

	L.marker([{$item->Lat}, {$item->Lon}).addTo(mymap)
		.bindPopup("<b><a href='{$item->url}'>{$item->name}</a><br />{$item->adresse}<br />4261 Rainbach<br />Tel.: {$item->telefon}</b>").;
	var popup = L.popup();

{/foreach}
{literal}


	function onMapClick(e) {
		popup
			.setLatLng(e.latlng)
			.setContent("You clicked the map at " + e.latlng.toString())
			.openOn(mymap);
	}
	mymap.on('click', onMapClick);
// ]]></script>
{/literal}

Du musst den Literal Teil vor und nach dem foreach unterbrechen. Deshalb interpretiert Smary das foreach auch nicht, da es innerhalb des Literal Teils steht.

[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox

Offline

#5 05. September 2020 22:45

Janl
Server-Pate
Ort: Freistadt, Österreich
Registriert: 13. Dezember 2010
Beiträge: 1.231
Webseite

Re: Smarty Logik in Javascript in Template

Hallo Nockenfell,

Danke, das Problem mit {literal} war mir bekannt.

Aber doch der Fehler gefunden, das Problem war erstens mein alias war nicht Lon und Lat aber lon und lat,
zweitens habe ich das automatisch öffnen der Popup mit Beschriftung der Marker weg geholt aber 1 Punkt übersehen bei
{$item->telefon}</b>").;

Jetzt funktioniert es.

Mit Lise habe ich jetzt ein "Company Directory" die OSM für Pläne Nutzt.

MfG
Jan

Kubuntu 22.04 - Win 11 pro / Kubuntu 20.04  - win10 pro

Offline

#6 05. September 2020 22:59

nockenfell
Moderator
Ort: Gontenschwil, Schweiz
Registriert: 09. November 2010
Beiträge: 2.931
Webseite

Re: Smarty Logik in Javascript in Template

Schön das du das Problem selber lösen konntest. LISE ist hier definitiv eine Wunderwaffe.

[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox

Offline

#7 05. September 2020 23:10

Janl
Server-Pate
Ort: Freistadt, Österreich
Registriert: 13. Dezember 2010
Beiträge: 1.231
Webseite

Re: Smarty Logik in Javascript in Template

Ohne Deine Hilfe hätte ich das nie gefunden, manchmal braucht man nur ein kleiner Schups in die richtige Richtung.

Lise ist wirklich ein sehr schönes Werkzeug für CMSMS, früher habe ich mit Listit folgendes gemacht
http://heimvb2.tierschutz-in.eu/index.php?page=hunde

Wenn ich fertig war, ist der Eigner des Tierheims leider verstorben.

MfG
Jan

Kubuntu 22.04 - Win 11 pro / Kubuntu 20.04  - win10 pro

Offline

#8 06. September 2020 10:13

nockenfell
Moderator
Ort: Gontenschwil, Schweiz
Registriert: 09. November 2010
Beiträge: 2.931
Webseite

Re: Smarty Logik in Javascript in Template

Das ist eine sehr schöne Seite. Gut und klar aufgebaut. Für solche Sachen ist LISE / ListIt das Schweizer Taschenmesser.

[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox

Offline

Seiten: 1


Fußzeile des Forums

Powered by FluxBB