Light Flow Light Flow - 3 months ago 19
Node.js Question

How can you obtain Get / Post URL parameters using Embedded Javascript (EJS)?

I'm looking for the equalivents in EJS, below is the php code:


<?php echo $_GET['name']; ?>


and

<?php echo $_POST['name']; ?>


I'm using Node.js, Express and Embedded Javascript (EJS).

Answer

You need to use the body-parser middleware in Express. If you use the express-generator, the code to include body-parser will be automatically generated.

Example

var bodyParser = require('body-parser');

and

app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false }));

Having the above ready in your "app.js" file, you need to specify route handling for your routes folder.

You have to make sure that the routes "register" and "registeration_complete" are available at the local server. For this make sure you have these lines in "app.js" to set them up:

var register = require('./routes/register');

var registeration_complete = require('./routes/registeration_complete');

app.use('/register', register);

app.use('/registeration_complete', registeration_complete);

Consider that there is a form in a view called "register.ejs". The "register.ejs" has an input text box with name='tb_email'. Example is as shown below:

<!DOCTYPE html>
<html>
  <head>
    <title>Contact</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>Contact</h1>
    <p>Welcome, enter your email address.</p>
    <form method="post" action="registeration_complete">
    <p><input type="text" size="12" name="tb_email"/>
    <p><input type="submit" value="Register"/>
    </form>
  </body>
</html>

Note: In the above input tag, you should have "name". Having "id" will not show the POSTed data.

The action of the form is set to "registeration_complete" so you now need to define a route handling in file named "registeration_complete.js" in your routes folder.

The content of the "registeration_complete.js" should be as below:

var express = require('express');
var router = express.Router();

/* GET home page. */
router.post('/', function(req, res, next) {

  var tb_email=req.body.tb_email;

  res.send('Your email address is: '+ tb_email );
});

module.exports = router;

If you now access "register" url of your application and enter an email address, it should show you the entered email address using the above "res.send" method in "registeration_complete.js" file.

Now that you are sure that the post value is available in the route, use "res.render" in the ""registeration_complete.js" file instead of the above "res.send" which was setup for testing purpose. You need to pass the variables in the render function that you want to access in the view using EJS.

The "registeration_complete.js" file should now look like this:

var express = require('express');
var router = express.Router();

/* GET home page. */
router.post('/', function(req, res, next) {

  var tb_email=req.body.tb_email;

  //res.send('Your email address is: '+ tb_email );
  res.render('registeration_complete', {email:tb_email});
});

module.exports = router;

Now, you have to make the "registeration_complete" view available, so your "registeration_complete.ejs" file in the "views" folder should look like this.

<html>
  <head>
    <title>Registeration complete</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>Thank you for registering.</h1>
    <p>Your email address is: <%= email %></p>
  </body>
</html>

Thats about it. You can access the local server's "/register" url and you should see an input form asking for email. Once you submit the form, the "registeration_complete.js" file handles the request and renders the "registeration_complete.ejs" file which outputs the entered email address using EJS.

Comments