时间戳

首页 > 解决方案 > Node-RED：无法访问 js 文件中选定的下拉值

javascript - Node-RED：无法访问 js 文件中选定的下拉值

问题描述

无法在ValidateInput函数中获取选定的下拉值

以下代码用于验证在文本框中输入的用户输入，并根据下拉菜单中选择的数据类型提供响应。

HTML：

 <script type="text/javascript" src="input.js">
    RED.nodes.registerType("myNode", {
        category: "function",
        color: "#a6bbcf",
        defaults: {
            data: {
                value: ""
            }
        },
        inputs: 1,
        outputs: 1,
        icon: "file.png",
        label: function() {
            return this.data || "myNode";
        },
        oneditprepare: function() {
            $("#selectMe").on("click", function() {
                    var selectedVal = $(this).find(':selected').val();
                    console.log("selectedVal:", selectedVal)
                    if (selectedVal == "photograph") {
                        $("#select-text").hide();
                        $("#select-photograph").show();
                    } else if (selectedVal == "geolocation" || selectedVal == "text" || selectedVal == "number" || selectedVal == "decimal" || selectedVal == "sensor") {
                        // this.data = "MYDATA";
                        $("#select-photograph").hide();
                        $("#select-text").show();
                    } else {
                        $("#select-text").hide();
                        $("#select-photograph").hide();
                    }
                })
             },
    });
</script>
<script type="text/html" data-template-name="myNode">
    <div class="form-row">
        <label for="node-select-data"><i class="icon-tag"></i> Choose Input type that you want:</label>
        <select id="selectMe">            
    <option value="">Select Data Type</option>
    <option value="text">String</option>
    <option value="number">Integer</option>
    <option value="decimal">Decimal</option>
    <option value="sensor">Sensor</option>
    <option value="geolocation">Geo Location</option>
    <option value="photograph">Photograph</option>
    </select>
    </div>
    <div id="select-text" hidden>
        <label for="node-input-data"><i class="icon-tag"></i> Enter the Data to be validated:</label>
        <input type="text" id="node-input-data" placeholder="Data..">
    </div>
    <div id="select-photograph" hidden>
        <label for="node-input-data">Select a Photograph file:</label>
        <input type="file" id="node-input-data" name="myfile">
    </div>
</script>

<script type="text/html " data-help-name="myNode ">
    <p>A simple node that validates the Data respect to the data type entered</p>
</script>

JS：

module.exports = function(RED) {
    "use strict ";

    function ValidateInput(config) {
        RED.nodes.createNode(this, config);
        this.log("RED:", RED);
        this.data = config.data;
        console.log("config:", config);
        console.log("data:", data);
        var node = this;
        node.on("select", function(msg, send, done) {
            var inputEntered = node.data;
        });
        node.on("input", function(msg, send, done) {
            var inputEntered = node.data;
            var letters = /^[A-Za-z]+$/;
            var numbers = /^[0-9]+$/;
            var decimal = /^[-+]?[0-9]+\.[0-9]+$/;
            if (inputEntered.match(letters)) {
                msg = {
                    payload: "Your input have been accepted",
                };
            } else if (inputEntered.match(numbers)) {
                msg = {
                    payload: "Your input have been accepted",
                };
            } else if (inputEntered.match(decimal)) {
                msg = {
                    payload: "Your input have been accepted",
                };
            } else {
                msg = {
                    payload: "Your input is wrong for this field",
                };
            }
            node.send(msg);
        });
    }
    RED.nodes.registerType("myNode", ValidateInput);
};

标签： javascripthtmljquerynode-red

解决方案

您似乎对 Node-RED 节点的一般概念有误解。

HTML 文件（和包含的脚本）在浏览器中运行并在配置时使用。

JS 文件完全在后端运行时运行，并且无法直接访问 HTML 文件中未作为config节点的一部分传递的任何内容。

如果要验证配置输入，则需要将 javascript 代码添加到oneditsave处理程序中的 HTML 文件而不是 JS 文件。

该node.on('input',...)函数在从先前连接的节点传递新消息时调用，它不用于处理配置信息。

我建议您阅读有关如何编写 Node-RED 节点的文档。

推荐阅读