Monatsrückblick Januar/Februar 2026 ist online!

[MarOde]

Hi,

ich versuche mich derzeit an meinen ersten Widgets und stecke da wirklich noch in den Kinderschuhen. Mit viel Ausprobieren mache ich auch Fortschritte. Jetzt scheitere ich an der Darstellung eines Wertes in der Runtime.

Der Wert ist in einem Sting Objekt abgelegt. (javascript.0.Calendar.Date).
Ein Attribut für den Edit Mode vom Typ ID habe ich angelegt und im Editor auch auf das Objekt verlinkt.
In dem Widget habe ich innerhalb eines DIVs die Zeile

<p><%== vis.states[this.data.attr('idDate') + '.val'] %></p>

eingefügt.
Im Editor wird der Inhalt auch völlig korrekt angezeigt.
Nur leider in der Runtime bleibt der Inhalt leer.

Ich weiß, totale Anfängerfrage. Ich finde echt keine Lösung. Hat jemand einen Tipp, was ich vergesse oder wo ich mal lesen kann?

Danke
Martin

[sigi234]

@MarOde sagte in VIS Widget Object Value in Edit, nicht in Runtime:

Der Wert ist in einem Sting Objekt abgelegt. (javascript.0.Calendar.Date).

Zeig mal den DP

[Homoran]

@MarOde sagte in VIS Widget Object Value in Edit, nicht in Runtime:

Nur leider in der Runtime bleibt der Inhalt leer.

Das widget selbst ist sichtbar?

[MarOde]

@Sigi234: Der DP sieht wie folgt aus (Ich hatte ihn im Beispiel oben etwas eingedampft):

{
  "from": "system.adapter.admin.0",
  "ts": 1555530325474,
  "common": {
    "name": "Calendar.Garbage.YellowDate",
    "role": "",
    "type": "string",
    "desc": "Manuell erzeugt",
    "def": "",
    "read": true,
    "write": true
  },
  "native": {},
  "acl": {
    "object": 1636,
    "owner": "system.user.admin",
    "ownerGroup": "system.group.administrator",
    "state": 1636
  },
  "_id": "javascript.0.State.Calendar.Garbage.YellowDate",
  "type": "state"
}

@Homoran: Ja, bis auf die leeren Inhalte sieht der gut (über Geschmack kann man ja streiten ) aus.

Im Editor wird alles dargestellt:
(
In der Runtime wird es dann mager:

Im Chrome Inspector ist die Stelle auch wirklich einfach nur leer:

<p></p>

[sigi234]

@MarOde

Stell das Widget mal rein um es zu testen.

[MarOde]

Was brauchst Du dafür?

Reicht das:

<script 
	id="tplVis-sie8StatusGarbage"
    type="text/ejs"
    class="vis-tpl"
    data-vis-set="vis-sie8"
	data-vis-name="Sie8 Status Garbage"
	data-vis-type="static"
    data-vis-attrs="idDate/id;idDays/id;"
	data-vis-attrs0="group.Sie8;imgIcon/image;colIcon[#ffffff]/color;"
	data-vis-prev='<div id="prev_tplVis-sie8StatusGarbage" style="position: relative; text-align: initial; padding: 4px "><div class="vis-widget_prev sie8-widget sie8-status-content vis-tpl-vis-sie8-Sie8 Status Garbage " style="width: 78px; height: 78px; left: 883px; top: 41px; position: absolute;"> <div class="vis-widget-prev-body sie8-widget-body"> <div class="sie8-status-content-garbage"> <img src="/icons-mfd-png/message_garbage.png" width="64"> </div> <div class="sie8-status-content-garbage"> <p>28.12.2019</p> </div> <div class="sie8-status-content-garbage"> <svg width="100" height="100"> <circle cx="65" cy="15" r="10" stroke="#eeeeee" stroke-width="0" fill="red"></circle> </svg> </div> <div class="sie8-status-content-garbage"> <p class="sie8-rednumber">7</p> </div> </div> <div class="ui-resizable-handle ui-resizable-n" style="z-index: 90;"></div><div class="ui-resizable-handle ui-resizable-w" style="z-index: 90;"></div><div class="ui-resizable-handle ui-resizable-nw" style="z-index: 90;"></div><div class="ui-resizable-handle ui-resizable-ne" style="z-index: 90;"></div><div class="ui-resizable-handle ui-resizable-sw" style="z-index: 90;"></div></div></div>'
	>

	<%
		var colImage = this.data.attr('colIcon');
	%>

	<div class="vis-widget sie8-widget sie8-status-content"  id="<%= this.data.attr('wid') %>" style="width: 78px; height: 78px;" >
		<div class="vis-widget-body sie8-widget-body">
			<div class="sie8-status-content-garbage" style="width: 60px; height: 60px; position: absolute; left: 10px; top: 2px;">
				<img <%= this.data.attr('imgIcon') ? 'src="' +  this.data.attr('imgIcon') + '"' : '' %> <%= (el) -> vis.binds.jqueryui.setSvgColor(el, colImage) %> >
			</div>
			<div class="sie8-status-content-garbage">
				<p><%== vis.states[this.data.attr('idDate') + '.val'] %></p>
			</div>
			<div class="sie8-status-content-garbage" style="width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;">
				<svg width="100%" height="100%">
					<circle cx="65" cy="15" r="10" stroke="#eeeeee" stroke-width="0" fill="red" />
				</svg>
			</div>
			<div class="sie8-status-content-garbage">
				<p class="sie8-rednumber"><%== vis.states[this.data.attr('idDays') + '.val'] %></p>
			</div>
		</div>
	</div>

</script>

[Update]
Wie gesagt, bin eher Anfänger, als Experte. Wenn ich mir die Console im Chrome Inspector anschaue, wird offenbar für jeden State, der irgendwo in der VIS verwendet wird, ein "Inner Vis Object angelegt". Nur für meine hier nicht

[sigi234]

@MarOde

Nein , Widget exportieren und hier im Code oder als Txt Anhang einfügen.

[MarOde]

OK, das bekomme ich hin widget.txt

[MarOde]

Ich vermute einmal, es liegt am daran, dass die Funktion createIds in der vis.js nicht aufgerufen wird. Da wird der Inhalt wohl erst in die States aufgenommen. Allerdings scheint die in dem Beispiel Widget aus dem Wizard (also diesem Show Instance) auch nicht separat aufgerufen zu werden.

Sorry, Jungs, ist mein erster Widget Versuch und ich stelle mich wohl ziemlich dumm an.

[sigi234]

@MarOde sagte in VIS Widget Object Value in Edit, nicht in Runtime:

OK, das bekomme ich hin widget.txt

Geht nicht bei mir, welches Widget ist das?

[MarOde]

Mein eigenes, dass ich gerade versuche zu bauen

[sigi234]

@MarOde sagte in VIS Widget Object Value in Edit, nicht in Runtime:

Mein eigenes, dass ich gerade versuche zu bauen

Aha, das ist was anderes, da bin ich raus.

[MarOde]

@sigi234 Danke für den Versuch!

[MarOde]

Das Thema ist gelöst. Zumindest funktioniert es jetzt bei mir.

Scheinbar werden data-vis-attr vom Typ id nur dann automatisch in die Liste der vis.states übernommen, wenn die Namensgebung mit oid beginnt.

Vielleicht kann das noch jemand bestätigen?

[Homoran]

@MarOde sagte in VIS Widget Object Value in Edit, nicht in Runtime:

Das Thema ist gelöst. Zumindest funktioniert es jetzt bei mir.

Scheinbar werden data-vis-attr vom Typ id nur dann automatisch in die Liste der vis.states übernommen, wenn die Namensgebung mit oid beginnt.

Vielleicht kann das noch jemand bestätigen?

Ich denke da es sich hier um die Entwicklung eigener Widgets handelt (So was hätte in den ersten Post gehört!!) ist das ein Thema für das Entwickler Unterforum

[MarOde]

Mein Fehler. Entschuldigt bitte.