Variables between HTML Client and Node.js Server

Question

I just wanna to pass variables from a HTML page to a node js and perform some calculations on the data and get it back to HTML using ejs After installing ejs :

npm install ejs

I'm trying to pass this variable temp with value 50 "HTML Page":

<html>
   <head>
   </head>
<body>
My temperature: <%= temp=50 %>
Temp + 10 : <%= total %>
</body>
</html>

and my nodejs server.js:

var http = require('http');
var ejs = require('ejs');
var fs = require('fs');

http.createServer(function(req,res) {
  res.writeHead(200, {'Content-Type': 'text/html'});

  //since we are in a request handler function
  //we're using readFile instead of readFileSync
  fs.readFile('index.html', 'utf-8', function(err, content) {
    if (err) {
      res.end('error occurred');
      return;
    }
    var temp;  //here you assign temp variable with needed value
    var total = temp+10;
    var renderedHtml = ejs.render(content, {temp: temp, total:total});  //get redered HTML code
    res.end(renderedHtml);
  });
}).listen(8080);

Any help would be appreciated Thanks in advance.

Nischay Malhan · Accepted Answer · 2016-01-01 11:14:02Z

1

In your server file, the value of temp is undefined. And so total = undefined + 10 = undefined. Hence both your variables are undefined in the server file. Try doing this (in the server file): var temp = 0 var total = 0

In the html file My temperature: <%= temp = 50 %> Temp + 10 : <%= total = temp + 10 %> Now it should display the correct value i.e 50 and 60. Hope this helps

edited Jan 1, 2016 at 11:14

answered Jan 1, 2016 at 10:59

Nischay Malhan

1114 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Hat hout Over a year ago

This way i can not use temp with value "50" in my "server.js" and i need to use it with it's value which i will pass by the HTML page.

Nischay Malhan Over a year ago

So you will pass a value on the html page and wanna use it on the server file.. right? But in the code you have written you are not passing any dynamic value on the html page. What you have done is hard coded the value of temp already. You should add an input field to your page which then stores the value dynamically to be then used by your server file. You can use angular for this.

Alvaro Silvino · Accepted Answer · 2016-01-01 11:30:17Z

0

You do not need this fs requirement.

All you need to do is :

var express = require('express');
var app = express();
var path = require('path'); //Use the path to tell where find the .ejs files
// view engine setup
app.set('views', path.join(__dirname, 'views')); // here the .ejs files is in views folders
app.set('view engine', 'ejs'); //tell the template engine


var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) { // route for '/'
  var temp = 50;  //here you assign temp variable with needed value
  var total = temp+10;
  res.render('index', { //render the index.ejs
    temp: temp,
    total:total
  });
});

var server = app.listen(3000, function() {
  var host = server.address().address;
  var port = server.address().port;

  console.log('Example app listening at http://%s:%s', host, port);
});

HTML (rename to index.ejs):

<html>
   <head>
   </head>
<body>
My temperature: <%= temp %>
Temp + 10 : <%= total %>
</body>
</html>

edited Jan 1, 2016 at 11:30

answered Jan 1, 2016 at 11:17

Alvaro Silvino

9,83314 gold badges56 silver badges81 bronze badges

3 Comments

Hat hout Over a year ago

I wanna pass the temp value from the HTML page

Alvaro Silvino Over a year ago

btw @Hathout this is not a best practice, if you want to use a value from html, I suggest you to create a javascript/text inside of the html content and then via javascript (not server side) update/use the values

Hat hout Over a year ago

Ok @Alvardo, here is my updated code

<!DOCTYPE html> <html> <body> <form> 	Set temperature:<br> 	<select id="temp"> 	<option>0</option> 	<option>1</option> 	<option>2</option> 	<option>3</option> 	<option>4</option> 	<option>5</option> 	<option>6</option> 	</select> C  	<br> 	<input type="button" onclick="myFunction()" value="Set Temp">  </form> <script> function myFunction()  {  var h = document.getElementById("temp"); var option_1 = h.options[h.selectedIndex].text; temp= Number(option_1); } </script> </body> </html>

Is that possible to pass the temp variable to the server.js file ?

Collectives™ on Stack Overflow

Variables between HTML Client and Node.js Server

2 Answers 2

2 Comments

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Related