How to pass user input dynamic value from html to js file in Node Red

[Ruhan Konduru]

Hello,

I am absolutely new to Node Red. I tried going through docs of Node-Red and some other blogs,but unfortunately nothing works

Currently i am having two file one as .html and .js files.

In html files i have username,password and some 10 other fields. 

In html files, i have defined configuser and configpass as variable name for username and password field. The other 10 fields will be get displayed only when username and password(labeled as Config Username and Config Password) are not empty.When user will enter this 2 fields i.e username and password(labeled as Config Username and Config Password) then other 10 fields will get be shown.

But, now what i am trying is to pass the dynamic value of username and password from html to js file, i am getting as undefined as output in js file

Please check the attachment file,there i have added as comment next to the code to make clear what exactly i have tried and i was looking out.

Let em know if anything not clear or want some more clarifications.

Thanks for Help and your time.

Sorry, Unable to attach it gives some error while posting with attach file

This is my JS File

module.exports = function (RED) {

    function SoapConfig(n) {

        RED.nodes.createNode(this, n);

        this.configuser = n.configuser;

        this.configpass = n.configpass;

        this.wsdl = n.wsdl;

        this.endpoint = n.endpoint;

        this.auth = n.auth;

        this.user = n.user;

        this.pass = n.pass;

        this.key = n.key;

        this.cert = n.cert;

        this.token = n.token;

        this.binding = n.binding;

        this.method = n.method;

    }

    RED.nodes.registerType("smp-soap-config", SoapConfig);

    

    console.log("username " + this.configuser);

    console.log("password " + this.configpass);

    RED.httpAdmin.get("/smpsoap-config", RED.auth.needsPermission('smpsoap-config.read'), function(req,res) {

        var util = require('util');

        var http = require('http');

        console.log("inside get function username " + this.configuser); //this is where trying to retreive the value but gettign as undefined

        console.log("inside get function password " + this.configpass); //this is where trying to retreive the value but gettign as undefined

        var options = {

          host: 'localhost',

          port: '8181',

          path: '/configweb/rest/6.0/dsaconfigurations',

          headers: {

            'Authorization': 'Basic ' + new Buffer('configuser' + ':' + 'configuser1').toString('base64')

            }   

        };

        var str = '';

        callback = function(response) {

            

            response.on('data', function (chunk) {

                str += chunk;

            });

            response.on('end', function () {

                res.json(str);

            });

        }

        http.request(options, callback).end();

        

        

    });

    

    RED.httpAdmin.post('/smpsoap-config/:wsdl/:endpoint/:username/:password/:binding', RED.auth.needsPermission('smpsoap-config.write'), function(req,res) {

        var http = require('http');

        var wsdl = decodeURIComponent(req.params.wsdl);

        var endpoint = decodeURIComponent(req.params.endpoint);

        var username = decodeURIComponent(req.params.username);

        var password = decodeURIComponent(req.params.password);

        var binding = decodeURIComponent(req.params.binding);

        if(binding === 'undefined') {

            var userNameString = username == 'undefined' ? '' : ',"username" :"'+username+'",';

            var passwordString = password == 'undefined' ? '' : '"password" :"'+password+'"';

            var post_data = 

            '{'+

                '"dsaName":"soap",'+

                '"methodName":"getBindings",'+

                '"connectionParameters": {'+

                    '"wsdlURL" : "'+wsdl+'",'+

                    '"endpointAddress" : "'+endpoint+'"'+

                    userNameString+

                    passwordString+

                '}'+

            '}';

            var post_options = {

                host: 'localhost',

                port: '8181',

                path    : '/configweb/rest/6.0/executedatasourcemethod',

                method  : 'POST',

                headers : {

                    'Authorization': 'Basic ' + new Buffer('configuser' + ':' + 'configuser1').toString('base64'),

                    'Content-Type': 'application/json',

                    'Cache-Control': 'no-cache',

                    'Content-Length': post_data.length

                }

            };

            

            var str = '';

            callback = function(response) {

                response.on('data', function (chunk) {

                    str += chunk;

                });

                response.on('end', function () {

                    res.json(str);

                });

            }

            var post_req = http.request(post_options, callback);

            post_req.write(post_data);

            post_req.end();

        } else {

            var userNameString = username == 'undefined' ? '' : ',"username" :"'+username+'",';

            var passwordString = password == 'undefined' ? '' : '"password" :"'+password+'"';

            var post_data = 

            '{'+

                '"dsaName":"soap",'+

                '"methodName":"getAvailableOperations",'+

                '"connectionParameters": {'+

                    '"wsdlURL" : "'+wsdl+'",'+

                    '"endpointAddress" : "'+endpoint+'"'+

                    userNameString+

                    passwordString+

                '},'+

                '"methodParameters" : [{'+

                        '"parameterName": "bindingName"'+

                    '}, {'+

                        '"parameterValue": "'+binding+'"'+

                    '}, {'+

                        '"parameterClass": "java.lang.String"'+

                    '}'+

                ']'+

            '}';

            

            var post_options = {

                host: 'localhost',

                port: '8181',

                path    : '/configweb/rest/6.0/executedatasourcemethod',

                method  : 'POST',

                headers : {

                    'Authorization': 'Basic ' + new Buffer('configuser' + ':' + 'configuser1').toString('base64'),

                    'Content-Type': 'application/json',

                    'Cache-Control': 'no-cache',

                    'Content-Length': post_data.length

                }

            };

            var str = '';

            callback = function(response) {

                

                response.on('data', function (chunk) {

                    str += chunk;

                });

                response.on('end', function () {

                    res.json(str);

                });

            }

            var post_req = http.request(post_options, callback);

            post_req.write(post_data);

            post_req.end();

        }

    });

}

[Julian Knight]

Sorry, shattered after a long week of planning work so I can't face working through your code I'm afraid. But you might like to look at https://github.com/TotallyInformation/node-red-contrib-jktesting in which I've tried to show best practice and to annotate as much as I can to show how things work when writing your own nodes.

[Nick O'Leary]

Hi Julian, after a quick look through your example node, I don't see anywhere that it demonstrates making requests from the node editor dialog back into the node's runtime component which is the question being asked here.

For those not in Slack, where this question has also been asked, I've pointed Ruhan at this SO answer that gives the basic details of doing this using the Serial node as a working example: https://stackoverflow.com/a/41567832/2117239

Nick

--
http://nodered.org
 
Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.
To unsubscribe from this group and stop receiving emails from it, send an email to node-red+unsubscribe@googlegroups.com.
To post to this group, send email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.
To view this discussion on the web, visit https://groups.google.com/d/msgid/node-red/0a2d9064-b99e-4d18-b857-d4204546f17f%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Julian Knight]

Yes, I did say that I hadn't looked through the code. It was more offered as a way of trying to learn more about how everything works together.

On Wednesday, 28 June 2017 20:40:05 UTC+1, Nick O'Leary wrote:

Hi Julian, after a quick look through your example node, I don't see anywhere that it demonstrates making requests from the node editor dialog back into the node's runtime component which is the question being asked here.

For those not in Slack, where this question has also been asked, I've pointed Ruhan at this SO answer that gives the basic details of doing this using the Serial node as a working example: https://stackoverflow.com/a/41567832/2117239

Nick

On 28 June 2017 at 20:35, Julian Knight <j.kni...@gmail.com> wrote:

Sorry, shattered after a long week of planning work so I can't face working through your code I'm afraid. But you might like to look at https://github.com/TotallyInformation/node-red-contrib-jktesting in which I've tried to show best practice and to annotate as much as I can to show how things work when writing your own nodes.

On Wednesday, 28 June 2017 20:20:21 UTC+1, Ruhan Konduru wrote:

Hello,

I am absolutely new to Node Red. I tried going through docs of Node-Red and some other blogs,but unfortunately nothing works

Currently i am having two file one as .html and .js files.

--
http://nodered.org
 
Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.

To unsubscribe from this group and stop receiving emails from it, send an email to node-red+u...@googlegroups.com.

To post to this group, send email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.

[K Uday]

Hi Nick,

I tried your workaround what you have suggested. But it doesn't worked out.

I tried some other approach of following the configuration node way.

To make readable i will use 

alias as 1st page for smp-soap-config.html and smp-soap-config.js file and 2nd page for smp-soap-config-node.html and smp-soap-config-node.js file

What i am doing is i defined as 

1 . config: {value: "", type: "smpsoap-user-details", required: true} in 1st page which will open new page in 2nd page where user will enter username and password.

2. Then, after user will input username and password ,it will redirect to the first page again.

Now here i am stuck , yesterday also i posted related to this is to get that username and password value from 2nd page to 1st page in i.e. smp-soap-config.js file,so that this based upon this value ajax call can be made.

And secondly, when page will redirect from 2nd page to 1st page how to reload this page. Because as i mentioned in above point, based on username/password this page needs to get reloaded and display new value everytime.

  

Sorry to post code ,but just want to make things more clear and easier to understand i posted 1st page and 2nd page both html and js file code.

Thanks in advance.

This is my updated code

smp-soap-config.html

<script type="text/javascript">

    RED.nodes.registerType('smp-soap-config', {

        category: 'config',

        color: '#3FADB5',

        defaults: {

            config: {value: "", type: "smpsoap-user-details", required: true},

            wsdl: {value: "", required: true},

            endpoint:{value: "", required: true},

            auth: {value: 0, required: true, validate: RED.validators.number()},

            user: {value: "", required: false},

            pass: {value: "", required: false},

            key:  {value: "", required: false},

            cert: {value: "", required: false},

            token: {value: "", required: false},

            binding: {value: "", required: true},

            method: {value: "", required: true}

        },

        oneditprepare: function () {

        },

        label: function () {

            return this.wsdl;

        }

});

</script>

<script type="text/x-red" data-template-name="smp-soap-config">

    <div id="form-hidden">

    <div class="form-row">

        <label for="node-config-input-config"><i class="fa fa-globe"></i> Config</label>

        <input type="text" id="node-config-input-config" placeholder="Config">

    </div>

    <div class="form-row">

        <label for="node-config-input-wsdl"><i class="fa fa-globe"></i> WSDL</label>

        <select id="node-config-input-wsdl"></select>

    </div>

    <div class="form-row">

        <label for="node-config-input-endpoint"><i class="fa fa-globe"></i> End point</label>

        <input type="text" id="node-config-input-endpoint"  class="ui-node-config">

    </div>

    <div class="form-row">

        <label for="node-config-input-auth"><i class="fa fa-unlock"></i> Auth</label>

        <select id="node-config-input-auth"  class="ui-node-config">

            <option value="1">Basic Auth</option>

        </select>

    </div>

    <div class="form-row">

        <label for="node-config-input-user"><i class="fa fa-user"></i> Username</label>

        <input type="text" id="node-config-input-user" class="ui-node-config">

    </div>

    <div class="form-row">

        <label for="node-config-input-pass"><i class="fa fa-lock"></i> Password</label>

        <input type="password" id="node-config-input-pass" class="ui-node-config">

    </div>

    <div class="form-row">

        <label for="node-config-input-key"><i class="fa fa-file"></i> Client Key</label>

        <input type="text" id="node-config-input-key">

    </div>

    <div class="form-row">

        <label for="node-config-input-cert"><i class="fa fa-file"></i> Client Certificate</label>

        <input type="text" id="node-config-input-cert">

    </div>

    <div class="form-row">

        <label for="node-config-input-token"><i class="fa fa-key"></i> Token</label>

        <input type="text" id="node-config-input-token">

    </div>

    <div class="form-row">

        <label for="node-config-input-binding"><i class="fa fa-globe"></i> Binding</label>

        <select id="node-config-input-binding" class="ui-node-config"></select>

    </div>

    <div class="form-row">

        <label for="node-config-input-method"><i class="fa fa-globe"></i> Method</label>

        <select id="node-config-input-method" class="ui-node-config"></select>

    </div>

    </div>

</script>

smp-soap-config.js

module.exports = function (RED) {

    function SoapConfig(n) {

        RED.nodes.createNode(this, n);

        this.wsdl = n.wsdl;

        this.endpoint = n.endpoint;

        this.auth = n.auth;

        this.user = n.user;

        this.pass = n.pass;

        this.key = n.key;

        this.cert = n.cert;

        this.token = n.token;

        this.binding = n.binding;

        this.method = n.method;

        this.config = n.config;

        this.configValue = RED.nodes.getNode(this.config);

        var node = this;

    }

    RED.nodes.registerType("smp-soap-config", SoapConfig);

    

    RED.httpAdmin.get("/smpsoap-config", RED.auth.needsPermission('smpsoap-config.read'), function(req,res) {

        var util = require('util');

        var http = require('http');

        

        var options = {

          host: 'localhost',

          port: '8181',

          path: '/configweb/rest/6.0/dsaconfigurations',

          headers: {

            'Authorization': 'Basic ' + new Buffer('configuser' + ':' + 'configuser1').toString('base64')

            }   

        };

        var str = '';

        callback = function(response) {

            

            response.on('data', function (chunk) {

                str += chunk;

            });

            response.on('end', function () {

                res.json(str);

            });

        }

       http.request(options, callback).end();

    });

smp-soap-config-node.html

<script type="text/javascript">

    RED.nodes.registerType('smpsoap-user-details', {

        category: 'config',

        color: '#3FADB5',

        icon: "white-globe.png",

        inputs: 1,

        outputs: 1,

        defaults: {

            configuser: {value: "",  required: true},

            configpass: {value: "",  required: true},

        },

        oneditprepare: function () {

          alert("oneditprepare");   

        },

        oneditsave: function () {

          var Username = document.getElementById('node-config-input-configuser').value;

        },

        label: function () {

            return this;

        }

    });

</script>

<script type="text/x-red" data-template-name="smpsoap-user-details">

    <div class="form-row">

        <label for="node-config-input-configuser"><i class="fa fa-user"></i> Config Username</label>

        <input type="text" name="configuser" id="node-config-input-configuser"/>

    </div>

    <div class="form-row">

        <label for="node-config-input-configpass"><i class="fa fa-lock"></i> Config Password</label>

        <input type="password" name="configpass" id="node-config-input-configpass"/>

    </div>

</script>

<script type="text/x-red" data-help-name="smpsoap-user-details">

    <p>Call SOAP Service</p>

    <b>msg.payload</b>. Receive parameters to call service on payload and response parameters is saved on payload.</p>

</script>

smp-soap-config-node.js

module.exports = function (RED) {

    function UserDetails(n) {

        RED.nodes.createNode(this, n);

        this.configuser = n.configuser;

        this.configpass = n.configpass;

        this.server = RED.nodes.getNode(this.config);

    }

    RED.nodes.registerType("smpsoap-user-details", UserDetails);

}

On Thursday, June 29, 2017 at 1:10:05 AM UTC+5:30, Nick O'Leary wrote:

Hi Julian, after a quick look through your example node, I don't see anywhere that it demonstrates making requests from the node editor dialog back into the node's runtime component which is the question being asked here.

For those not in Slack, where this question has also been asked, I've pointed Ruhan at this SO answer that gives the basic details of doing this using the Serial node as a working example: https://stackoverflow.com/a/41567832/2117239

Nick

On 28 June 2017 at 20:35, Julian Knight <j.kni...@gmail.com> wrote:

Sorry, shattered after a long week of planning work so I can't face working through your code I'm afraid. But you might like to look at https://github.com/TotallyInformation/node-red-contrib-jktesting in which I've tried to show best practice and to annotate as much as I can to show how things work when writing your own nodes.

On Wednesday, 28 June 2017 20:20:21 UTC+1, Ruhan Konduru wrote:

Hello,

I am absolutely new to Node Red. I tried going through docs of Node-Red and some other blogs,but unfortunately nothing works

Currently i am having two file one as .html and .js files.

--
http://nodered.org
 
Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.

To unsubscribe from this group and stop receiving emails from it, send an email to node-red+u...@googlegroups.com.

To post to this group, send email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.