Feeding template node (mustache) with {{payload}}

General
1

Hi all,
on each call of http://:1880/test the old text should be shown up onto the page utilising onload function in combination with {{payload}} as the following flow outlines as example:

[{"id":"196c09a7.6b48d6","type":"http response","z":"b83beaae.9b4368","name":"","statusCode":"","headers":{},"x":509,"y":101,"wires":[]},{"id":"6858a3dc.35d3ac","type":"http in","z":"b83beaae.9b4368","name":"","url":"/test","method":"get","upload":false,"swaggerDoc":"","x":147,"y":134,"wires":[["d91fc6d1.fbe778"]]},{"id":"d91fc6d1.fbe778","type":"template","z":"b83beaae.9b4368","name":"Config!","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":" \n \n <script type="text/javascript">\n function test() {\n var tst = "This works!"; \n // document.getElementById("oldText").innerHTML = tst; \n document.getElementById("oldText").innerHTML = {{payload}}; \n }\n \n\n<body onload="test()" >\n\n \n\n <form action="/test" method="post">\n \n

Old Text:

\n <label for="text">Change Text to: \n <input type="text" name="text" >\n <input type="submit"value="Send" >\n \n \n\n \n \n","output":"str","x":354,"y":101,"wires":[["196c09a7.6b48d6"]]},{"id":"19942353.277d8d","type":"http in","z":"b83beaae.9b4368","name":"","url":"/test","method":"post","upload":false,"swaggerDoc":"","x":141,"y":58,"wires":[["d91fc6d1.fbe778"]]},{"id":"8102c755.de83a8","type":"inject","z":"b83beaae.9b4368","name":"Trigger","topic":"","payload":"Does it work?","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":198,"y":197,"wires":[["d91fc6d1.fbe778"]]}]

Unfortunately, feeding payload into the flow does not show up as expected, while the static approach (via var tst = "This works!") works...

Can anyone give me some advice on how to resolve that issue? Maybe this approach is generally not ok...

Many thanks for your comments in advance!

Kind regards,
Michael

2

Unfortunately your flow isn't importable, can you edit your post to put ``` before and after it?

3

ok, sorry, I am new to this forum and not very familiar with formatting. Here comes the flow again...but before I would like to sharpen my objective...on 'onload' I would like to request via MQTT certain information from an Arduino platform, such platform responds with MQTT, too, and the data should be placed on the web page.
The flow example does not really reflect this use case. However it stresses the fundamental issue to feed something into a block which then is reflected in the web page...
[{"id":"196c09a7.6b48d6","type":"http response","z":"b83beaae.9b4368","name":"","statusCode":"","headers":{},"x":509,"y":101,"wires":[]},{"id":"6858a3dc.35d3ac","type":"http in","z":"b83beaae.9b4368","name":"","url":"/test","method":"get","upload":false,"swaggerDoc":"","x":147,"y":134,"wires":[["d91fc6d1.fbe778"]]},{"id":"d91fc6d1.fbe778","type":"template","z":"b83beaae.9b4368","name":"Config!","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html> \n <head>\n <script type=\"text/javascript\">\n function test() {\n var tst = \"This works!\"; \n document.getElementById(\"oldText\").innerHTML = tst; \n // document.getElementById(\"oldText\").innerHTML = {{payload}}; \n }\n </script>\n</head>\n<body onload=\"test()\" >\n\n \n\n <form action=\"/test\" method=\"post\">\n \n <p> Old Text: <p id=oldText> </p> </p>\n <label for=\"text\">Change Text to: </label>\n <input type=\"text\" name=\"text\" >\n <input type=\"submit\"value=\"Send\" >\n \n </form>\n\n </body>\n</html> \n","output":"str","x":354,"y":101,"wires":[["196c09a7.6b48d6"]]},{"id":"19942353.277d8d","type":"http in","z":"b83beaae.9b4368","name":"","url":"/test","method":"post","upload":false,"swaggerDoc":"","x":141,"y":58,"wires":[["d91fc6d1.fbe778"]]},{"id":"8102c755.de83a8","type":"inject","z":"b83beaae.9b4368","name":"Trigger","topic":"","payload":"Does it work?","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":198,"y":197,"wires":[["d91fc6d1.fbe778"]]}]