NEWS
Parameterübergabe an javascript in HTML
-
Nachdem meine Frage gestern offensichtlich nicht klar war hier die Frage ganz einfach formuliert:
Ich nutze in node red html template node mit großer Begeisterung. Es fehlt mir aber ein Glied in der Kette.Wie kann ich den Wert 60 in der Zeile 10 über msg.payload an die Funktion weitergeben.
Alle Beispiele im Netz arbeiten mit Konstanten oder mit Input. Ich möchte den Wert als Variable haben.<!DOCTYPE html> <html> <body> <p>This example calls a function to convert from Fahrenheit to Celcius:</p> <p id="demo"></p> <script> function toCelcius(f) { return (5 / 9) * (f - 32); } document.getElementById("demo").innerHTML = toCelcius( 60 ); </script> </body> </html>
-
@franzda sagte in Parameterübergabe an javascript in HTML:
über msg.payload
also mit node-red?
dann verschib ich das dahin -
@homoran Ja es ist node red; html; und javascript betroffen.
Ich weiß nicht wo die Frage am besten aufgehoben ist. Ich glaube aber nicht dass die Lösung node red abhängig ist. Wollte node red nur nennen damit jeder ein genaues Bild von der Frage hat -
@franzda
Könnte man mal das Template sehen
Und wie die payload aussieht die die Node erhält?Du könntest den Wert als Attribut in der payload übergeben und im Template dann dieses Attribut an entsprechender Stelle einsetzt
-
Hallo Danke für die Reaktion.
Habe den Fall abgespeckt um die eigentliche Frage zu zeigen.
An sich geht es "nur" darum wie ich kleinere Berechnungen im html script machen kann um die function node nicht zu brauchen.
Das klappt mit function node bestens jedoch habe ich Stellen wo ich zusätzlich mit join node arbeiten muss.
Würde ich schript in html aufrufen könne dann wäre einiges transparenter.hier die Funkion die in html ohne fuction node laufen sollte und danach html taemplate sowie debug ausgabe von den nodes.
Bitte gleich fragen wenn noch was unklar ist. (habe angular auch schon gesichtet sehe aber die Lösung dort auch (noch) nicht
var wert = { payload: null }; lok = {}; lok.val = msg.payload.val; lok.aktu = (new Date(msg.payload.lc)).toLocaleTimeString(); wert.payload = lok; wert.topic = "change Time"; return [wert];
<div ng-bind-html="msg.payload.val"></div> <div ng-bind-html="msg.payload.aktu"></div>
 
-
@franzda sagte in Parameterübergabe an javascript in HTML:
An sich geht es "nur" darum wie ich kleinere Berechnungen im html script machen kann um die function node nicht zu brauchen.
den Ansatz verstehe ich immer noch nicht.
genau dafür ist doch der function-node da.Jetzt willst du erst eine HTML-Seite mit js - bearbeiten, um das Ergebnis dann mit node-red weiterzuverwursten (oder umgekehrt)??
Das ergibt für mich keinen Sinn. -
@homoran nein es geht darum dass ich mehrere Listen habe. Unterschidlicher Inhalt. Die werte visualisiere ich über html template. Meisten mit folgende Struktur
Zwischen Quelle und Template ist ein function node die unnötig ist wenn ich z.B. den wert payload.lc formatiert ausgeben kann.
Der einzige Punkt ist dass überall die HTML Funktionsbeispiele mit Konstanten und mit Input Box und nicht mit Variablen beschrieben sind.
Es mag sein dass mein Stil nicht typisch ist, aber nach 40 Jahre programmier bzw. IT Erfahrung hat man bestimmte "Gewohnheiten" bzw. Vorlieben.
Wie im Beispiel, denke ich nachvollziehbar dass mein Ansatz einen gewissen Charme hat<tr ng-repeat="element in msg.payload"> <!-- Feld 0 --> <td ng-if="element.wert9 != true && element.wert10 != true" WIDTH="5%" ALIGN="CENTER" bgcolor='white'> <font color='black'> <div ng-bind-html="element.wert0"></div> </font> </td> </tr>
-
@franzda sagte in Parameterübergabe an javascript in HTML:
new Date(msg.payload.lc)).toLocaleTimeString();
ok, hier mal ein ganz einfacher flow um das grundprinzip zu verstehen.
erst mal ohne objektanlage.
du willst die daten ja direkt in die seite hineinschreiben und nicht durch die seite irgendwie abfragen lassen (würde über den simple-adapter gehen.
im folgenden beispiel flow wird der lc-wert eines datenpunktes in ein template als klartext ausgegeben direkt in einem javascript. die dann erzeugte seite kann dann über den node-red webserver abgerufen werden
http://<ip des iobrokers>:1880/test
den request namen kann man in der node http in ganz links definieren
danach wird der wert aus iobroker abgerufen und in ein template geschrieben
das template wird als text ausgeliefert und der webbrowser interpretiert den inhalt
der eventhandler im template ist notwendig, da das skript erst loslaufen darf, wenn die seite komplett geladen ist.wenn du dir mal das erzeugte javascript im browser anschauen willst, dann entferne vor im template vor debugger die //, deploye neu, öffne im browser die develeoper konsole und lade die seite neu. dann bleibt der code direkt an der stelle stehen. mit f8 kannst weiter laufen lassen
mit f10 per einzelschritt weitergehen, rechts im scope bereich kannst du dir die variableninhalte andschauen -
@oliverio Hallo oliverio DANKE für deine echt tolle und ausführliche Antwort.
Jetzt habe ich die Funktionalität begriffen.Ich werde mein Vorhaben nun anders lösen. Ich werde die Daten mit einem Funktionsblock vorbereiten usw.