1

I am a beginner in node.js. I am trying to add a 'name' and 'department' using a form. once i click submit, i am consoling both 'name' and 'department' but I am getting 'both' are 'undefined'.

I don't know where is the worng I did. any one figure out and help me to console the name and department?

here is my form:

<form method="post" role="form" class="form-horizontal" enctype='multipart/form-data'>
        <div class="form-group">
            <label for="name"><input id='name' name='name' placeholder='Enter your name' type="text" ></label>
            <label for="dept"><input id='dept' name='dept' placeholder='Enter your department here' type="text"></label>
            <button type='submit' class="btn btn-default" id='submit'>Submit your Details</button>
        <div>
    </form>

Here is my app.js

var
http     = require('http'),
express  = require('express'),
routes   = require('./routes'),
userList = require('./routes/list'),
path     = require('path'),

app     = express();

app.set('port', process.env.PROT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.use(app.router); 
app.use(express.static(path.join(__dirname, 'static')));


app.get('/', routes.list);
app.get('/addList', userList.addList);
app.post('/addList', function(req, res){
    var name = req.params.name;
    var dept = req.params.dept;

    console.log(name, dept);//getting undefined why?
});

http.createServer(app).listen(app.get('port'), function(){
    console.log('successfuly initiated!');
});

updated form and app.js

Form:

<form method="post" role="form" class="form-horizontal" action="/addList">
        <div class="form-group">
            <label for="name"><input id='name' name='name' placeholder='Enter your name' type="text" ></label>
            <label for="dept"><input id='dept' name='dept' placeholder='Enter your department here' type="text"></label>
            <p><input type='submit' class="btn btn-default" id='submit' value='Submit your Details'/></p>
        <div>

app.js

var
http     = require('http'),
express  = require('express'),
routes   = require('./routes'),
userList = require('./routes/list'),
path     = require('path'),

app     = express();

app.set('port', process.env.PROT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');


app.use(app.router); 
app.use(express.static(path.join(__dirname, 'static')));
app.use(express.bodyParser()); //newly added
app.use(express.urlencoded()); //newly added

app.get('/', routes.list);
app.get('/addList', userList.addList);
app.post('/addList', function(req, res){
    var name = req.body.name;
    var dept = req.body.dept;

    console.log(name, dept);

});

http.createServer(app).listen(app.get('port'), function(){
    console.log('successfuly initiated!');
});
3gwebtrain
  • 14,640
  • 25
  • 121
  • 247

1 Answers1

4

Your form is missing action="/addList" attribute

also since you are posting with method POST your values will be on the body

var name = req.body.name;
var dept = req.body.dept;

for the values to appear in body add this middleware

app.use(express.bodyParser());
app.use(express.urlencoded());

app.use(app.router) should be the last thing you call.

dark_ruby
  • 7,646
  • 7
  • 32
  • 57
  • I am getting error as : 'TypeError: Cannot read property 'name' of undefined' - as well what is diff between req.body and req.params? – 3gwebtrain Mar 10 '14 at 12:08
  • http POST means values will be passed as part of request body, not part of URL, I updated my answer for `req.body.*` to work – dark_ruby Mar 10 '14 at 12:22
  • Add `app.use(express.bodyParser());` before `app.use(app.router)`. If you post a JSON object, submit a form, or upload a file from the client side, the data are stored as `req.body` by the bodyParser middleware. `req.params` is an array containing properties mapped to the named route "parameters". Ref: [req.params](http://expressjs.com/api.html#req.params) – bnuhero Mar 10 '14 at 12:24
  • @dark_ruby The bodyParser middleware is simply a wrapper for the json(), urlencoded(), and multipart() middleware. So `app.use(express.urlencoded());` is **NOT** needed. – bnuhero Mar 10 '14 at 12:27
  • Still I added bodyParser and urlencoded, I am not get the result. I am getting error message like this: TypeError: Cannot read property 'name' of undefined at /Users/mohamedarif/Sites/userList/app.js:23:21 at callbacks.... – 3gwebtrain Mar 10 '14 at 12:29
  • My updated code added on my question. please check. still not working! – 3gwebtrain Mar 10 '14 at 12:32
  • updated my answer - `app.use(app.router)` should be the last thing you call. – dark_ruby Mar 10 '14 at 12:38
  • yes. agree. ( if possible let me know why? ), thanks for you help. it works! – 3gwebtrain Mar 10 '14 at 12:40
  • glad it's working for you, read more here http://stackoverflow.com/questions/13254549/in-express-what-does-app-router-do-exactly – dark_ruby Mar 10 '14 at 12:42