My first post in the forum. I have searched various posts and website to get my task done but to no avail.
I have my HTML set up to receive Javascript template.
The list if hardcoded, there's no problem showing in the webpage dropdown list.
But when i query my database for an Array object and pass to the Javascript template, it doesnt show up in the list.
I have few examples, where some showed a list of [object Object] in the debug node.
Below is the query from databse in Array object:
Below are the Javascript template node and HTML template node.
[{"id":"10505034.220c3","type":"template","z":"ede045f6.075bc8","name":"JavaScript","field":"payload.script","fieldType":"msg","format":"javascript","syntax":"plain","template":"$(document).ready(function(e) {\n \n $(\"form[ajax=true]\").submit(function(e) {\n \n e.preventDefault();\n \n var form_data = $(this).serialize();\n var form_url = $(this).attr(\"action\");\n var form_method = $(this).attr(\"method\").toUpperCase();\n \n $(\"#loadingimg\").show();\n \n $.ajax({\n url: form_url, \n type: form_method, \n data: form_data, \n cache: false,\n success: function(returnhtml){ \n $(\"#result\").html(returnhtml); \n $(\"#loadingimg\").hide(); \n } \n }); \n \n });\n \n \n \nvar select = document.getElementById(\"PAname\");\nvar options = [\"1\", \"2\", \"3\", \"4\", \"5\"];\n//var options = msg.payload;\nfor(var i = 0; i < options.length; i++) {\n var opt = options[i];\n var el = document.createElement(\"option\");\n el.textContent = opt;\n el.value = opt;\n select.appendChild(el);\n}\n\n(function(scope) {\n console.log('Position 1');\n console.dir(scope);\n console.log(scope.msg);\n scope.$watch('msg.payload', function(data) {\n console.log('Position 2');\n console.dir(data);\n });\n })(scope);\n \n \n \n});\n\n","x":730,"y":300,"wires":[["d2c181dd.e046e","2c484bdb.d26924"]]},{"id":"d2c181dd.e046e","type":"template","z":"ede045f6.075bc8","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head>\n <title>Quality Check Data Entry</title>\n <meta name=\"viewport\" content=\"initial-scale=1.0, user-scalable=no\">\n <meta charset=\"utf-8\">\n <script src=\"http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js\"></script>\n <style>{{{payload.style}}}</style>\n </head>\n\n <body>\n <div>\n {{ errorMessage }}\n <form method=\"post\" action=\"/{{url}}\" ajax=\"true\">\n <h1>Enter physical test results</h1>\n <h2>-----LINE 1-----</h2>\n \n <h4></h4>\n <label for=\"PA_name\">PA Name:</label>\n <select required id=\"PAname\" name=\"PA_name\" onfocus=\"this.value=''\">\n <option>Choose a number</option>\n \n </select>\n \n <h4></h4>\n \n <label for=\"DensityResults\">Density Results:</label>\n <input type=\"number\" step=\"0.001\" placeholder=\"0.000\" min=\"0.000\" max=\"1.000\" required name=\"DensityResults\" onfocus=\"this.value=''\"/>\n <span class=\"validity\"></span>\n <h4></h4>\n <label for=\"MoistureResults\">Moisture Results:</label>\n <input type=\"number\" step=\"0.01\" placeholder=\"0.00\" min=\"1\" max=\"50\" required name=\"MoistureResults\" onfocus=\"this.value=''\" />\n <span class=\"validity\"></span>\n <h4></h4>\n \n <h2><input type=\"submit\" /></h2>\n </form>\n </div>\n <div>\n <span id=\"result\"></span>\n </div>\n </body>\n</html>\n\n<script>{{{payload.script}}} </script>\n<script type=\"text/javascript\">\n //reload page 5seconds after form submission\n $(\"form\").onsubmit = setTimeout(function(){\n location.reload(true); //modification\n }, 60000);\n \n\n </script>\n","output":"str","x":940,"y":300,"wires":[["e6d93d9d.20ff7","fa9b4408.2b47a8"]]}]
