How set the output variable "{{msg.payload}}" in JS?!

General
27

Zenofmud
Hello!
i made some progress and here is the code.
Thanks a lot!

[{"id":"e80282f6.c0116","type":"mqtt in","z":"2ce1fffe.a59ac","name":"WheelLoad","topic":"d/mes_whload/json","qos":"2","broker":"d2ce4d1a.6fdee","x":99.00004577636719,"y":102.00000667572021,"wires":[["72ae2bc6.9108f4"]]},{"id":"60bbfd6.6c56e04","type":"ui_template","z":"2ce1fffe.a59ac","group":"42b3b58f.8e0e4c","name":"WHEEL LOAD","order":0,"width":"24","height":"10","format":"<style>\n th {\n text-decoration: bolt;\n }\n .numeric {\n text-align: right;\n padding-right: 15px;\n }\n</style>\n\n<table cellpadding=\"1\" border=\"1\" id=\"table\" style=\"width: 35%;\">\n\n <tr>\n <th>prd_dt1</th> \n <th>prd_dt2</th>\n <th>Prd_dt3</th>\n <th>Seq_No</th>\n <th>Ass_cd</th>\n <th>brd_cd</th>\n <th>air_pr</th>\n <th>val-cd</th>\n <th>spr_fg</th>\n <th>ins_ct</th>\n <th>sum_ct</th>\n <th>ass_ma</th>\n <th>whe_na</th>\n <th>Tir_na</th>\n <th>prd_md</th>\n <th>get_tm</th>\n </tr>\n <tbody>\n <tr ng-repeat=\"row in msg.payload\" >\n <td ng-repeat=\"item in row\" bgcolor=lightgrey>{{item}}</td>\n \n </tr>\n </tbody>\n</table>\n<script>\n(function($scope) {\n $scope.sendRow = function(obj) {\n //$scope.send({ \"payload\": obj });\n //$scope.send({ \"payload\": (document.getElementById(\"table\").rows[0].innerText) });\n $scope.send({ \"payload\": (document.getElementById(\"table\").rows[1].innerText) });\n };\n})(scope);\n</script>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":899.0196075439453,"y":105.0039119720459,"wires":[[]]},{"id":"a42f7083.4cbd6","type":"join","z":"2ce1fffe.a59ac","name":"Create 2D array","mode":"custom","build":"array","property":"payload","propertyType":"msg","key":"topic","joiner":"\\n","joinerType":"str","accumulate":false,"timeout":"","count":"10","reduceRight":false,"reduceExp":"","reduceInit":"","reduceInitType":"","reduceFixup":"","x":594.8867721557617,"y":105.16406905651093,"wires":[["60bbfd6.6c56e04"]]},{"id":"72ae2bc6.9108f4","type":"function","z":"2ce1fffe.a59ac","name":"object","func":"var obj = JSON.parse(msg.payload);\nmsg.payload = obj;\nreturn msg;","outputs":1,"noerr":0,"x":319.89842987060547,"y":103.378910779953,"wires":[["a42f7083.4cbd6","415d48cb.028918"]]},{"id":"d2ce4d1a.6fdee","type":"mqtt-broker","z":"","name":"MACWest-1","broker":"172.16.5.7","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"willTopic":"","willQos":"0","willPayload":"","birthTopic":"","birthQos":"0","birthPayload":""},{"id":"42b3b58f.8e0e4c","type":"ui_group","z":"","name":"Wheel load","tab":"636515f8.bdc4dc","order":1,"disp":true,"width":"24","collapse":false},{"id":"636515f8.bdc4dc","type":"ui_tab","z":"","name":"Chart display","icon":"dashboard","order":1}]

28

Capture4
Capture4.JPG1353×399 89.8 KB

2 Likes
29

hey please, I am trying to do a similar thing but I am trying to make an if function in the script section of the html code, to read a specific payload and if it gets that function , then it fdoes a delegated task... do you know how I can do that

30

Normally you would pre-process the array of data before it gets to the html page rendering. When you say "delegated task", what does that mean? Would that task run on the node-red server or in the browser client?

If you just want to hide or show html elements based on the incoming data, then look at using angular directives, like ng-if or ng-hide.

31

image1
image1.jpeg480×640 97.1 KB
image2
image2.jpeg480×640 97.7 KB
image3
image3.jpeg480×640 101 KB

Hope this isnt too much stress, could you look at my code to have a little more idea what I am talking about, I need to if function that has if(msg.payload) to work because it dooesnt work at the moment... if you could explain again baseed on my code, that would be much appreciated because I have never use angular and im new to javascript as it is

32

Photos of screens of code make it very hard to help - especially when the one block of code is split over multiple photos. If anyone wanted to test it they would have to type it all out. If anyone wanted to point at a mistake, they would have to type out the relevant section.

If at all possible, copy and paste your code (with the ``` on new lines before and after).

Please also considering starting your own topic in the forum rather than hijack someone else's post.

1 Like
33

The short answer is that you cannot access msg.payload directly from inside your browser's <script>...</script> elements -- please read through the answers given on this recent discussion thread.

34

You already posted your question in a separate topic few minutes ago. It is not a good idea to repeat it here as it will only add confusion.