CODEWITHSUNDEEP
node.jsexpress
Rijo
Rijo

Reputation: 3043

Express js Image upload and Text inputs using post method

I have following code for uploading image and handling text input. But both are not working together *Images are uploading properly but I can't get text field value * 

var express = require('express');
var multer	=	require('multer');
var mime    =   require('mime');
var app = express();
var bodyParser =	require("body-parser");
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

var storage	=	multer.diskStorage({
  destination: function (req, file, callback) {
    callback(null, './uploads');
  },
  filename: function (req, file, callback) {
    callback(null, file.fieldname + '-' + Date.now() + '.' + mime.extension(file.mimetype));
  }
});
var upload = multer({ storage : storage }).array('userPic');

app.get('/completeForm.html', function(req, res){
	res.sendFile(__dirname + '/' + 'completeForm.html')
});

app.post("/postFormAct", function (req, res, next) {
	console.log(req.body.user); // Here i getting undefined
	console.log(req.body.email);// Here i getting undefined
	
	upload(req,res,function(err) {
		console.log(req.files); // Here i getting proper output and image also uploading to concern folder
	});
	
});

app.listen(3000);

Html code given below.... please help me someone 

<form method="post" action="/postFormAct" enctype="multipart/form-data">
    <input type="text" name="user"><br>
    <input type="text" name="email"><br>
	<input type="file" name="userPic"><br>
    <input type="submit" value="Submit">
</form>

Upvotes: 7

Views: 8154

Answers (2)

Steven Winston
Steven Winston

Reputation: 102

Just put 

console.log(req.body.user);
console.log(req.body.email);

inside your upload function. After the function may also work.

Upvotes: 3

Peracek
Peracek

Reputation: 1971

That's because there is no multipart/form-data parsing middleware called before your /postFormAct route handler.

You have two parsing middlewares set up but not one of them parse this multipart/form-data Content-Type.

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

Multer does that, so you can access req.body.user and req.body.email variables in handlers following your upload middleware.

Upvotes: 0

Related Questions