2

I am trying to create custom node, I am experimenting with very simple one. I need to use the node's property, the value chosen by the user from a dropdown, to send/output the value of that property with msg.payload.

This is the error msg in the debug tab:

4/7/2017 21.45.06node: lolo
msg : error
"ReferenceError: $ is not defined"

This is the desired output:

"ppp[lolo:m2]"

I remove the line with $ in js file, because it does not recognize jQuery. I use this instead

msg.payload = msg.payload +"[" + nodeName+":"+ node.axis +"]";

but in output the option value is undefined instead of value of one of the options from select dropdown:

5/7/2017 11.34.22node: 5aa4aa59.f9fa04
msg.payload : string[19]
"ppp[lolo:undefined]"

This is the html file for the node:

<script type="text/javascript">
    RED.nodes.registerType('Hello World',{
        category: 'Demo',
        color: '#ffaaaa',
        defaults: {
            name: {value:""},
		axis:{value:""}
        },
        inputs:1,
        outputs:1,
        icon: "face.png",
        label: function() {
            return this.name||"Hello World";
        }
    });
</script>
<script type="text/x-red" data-template-name="Hello World">
    <div class="form-row">
        <label for="node-input-name"><i class="icon-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-row">
        <label for="node-input-topic"><i class="icon-tag"></i> Topic</label>
        <input type="text" id="node-input-topic" placeholder="Topic">
    </div>
	<div class="form-row">
        <label for="node-input-axis"><i class="icon-tag"></i> Motor</label>
        <!--<input type="text" id="node-input-axis" placeholder="axis">-->
		<select value="" id="node-input-axis" placeholder="axis">
            <option value="m1">m1</option>
            <option value="m2">m2</option>
            <option value="m3">m3</option>
            <option value="m4">m4</option>
        </select>
    </div>
</script>
<script type="text/x-red" data-help-name="Hello World">
    <p>A node that increments every time a new message is received and sends Hello World in return.<br/>
    </p>
</script>

This is the js file for the node:

module.exports = function(RED) {
    function helloWorld(config) {
        RED.nodes.createNode(this,config);
        //var context = this.context();
		var nodeName = this.name;
		var axis = config.axis; 
        var node = this;
		//var $ = require('jQuery');
		var x = $("#node-input-axis").val();
        this.on('input', function(msg) {
			msg.payload = msg.payload +"[" + nodeName+":"+ x +"]";
			//{payload: nodeName+" "+node.axis};
			node.send(msg);
        });
		//console.log(value);
    }
    RED.nodes.registerType("Hello World",helloWorld);
};

1 Answer 1

5

It is important to remember that the 2 separate parts of a Node-RED node run in very different locations:

  • The .js file runs on the backend server side of Node-RED
  • The .html file runs in the web browser that is accessing the Node-RED Editor on the users client machine.

This means that the .js file has no direct access to the fields in the editor configuration window and also there is no access to jquery ($) notation.

When a flow is deployed all the configuration variables are passed to the backend in the config variable. You have already accessed that value in:

var axis = config.axis; 

so rather than the var x = $("#node-input-axis").val(); you can just use the axis variable.

You can't use node.axis because you have not bound config.axis to either this.axis or node.axis before trying to use it

e.g.:

module.exports = function(RED) {
    function helloWorld(config) {
        RED.nodes.createNode(this,config);
        //var context = this.context();
        var nodeName = this.name;
        this.axis = config.axis; 
        var node = this;

        this.on('input', function(msg) {
            msg.payload = msg.payload +"[" + nodeName+":"+ node.axis +"]";
            //{payload: nodeName+" "+ node.axis};
            node.send(msg);
        });
        //console.log(value);
    }
    RED.nodes.registerType("Hello World",helloWorld);
};

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.