Cannot POST with express Router() (get is running fine)

Sorry , if this is an obvious error, but this is my first node project So I've been trying to work this out for some time now and I'm missing something here. I'm trying to determine the best practice for setting up routes in Express. I'd like to separate the different routes I have setup by file. I'm trying to use the Express Router module, but I can't get it to work.

webpage is not responding when submitting the form.(infinite loading)

app.js

var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var expressHbs = require('express-handlebars');
var mongoose = require('mongoose');
var session = require('express-session');
var passport = require('passport');
var flash = require('connect-flash');

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

var app = express();

mongoose.connect('/localhost:27017/shopping');
require('./config/passport');

// view engine setup
app.engine('.hbs', expressHbs({defaultLayout: 'layout', extname: '.hbs'}));
app.set('view engine', '.hbs');


app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(session({secret: 'mysupersecret', resave: false, saveUninitialized: 
false}))
app.use(flash());
app.use(passport.initialize());
app.use(passport.session());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', routes);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});


app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};

// render the error page
res.status(err.status || 500);
res.render('error');
});

module.exports = app;

My router/index.js looks like this

var express = require('express');
var router = express.Router();
var csrf = require('csurf');
var passport = require('passport');

var Product = require('../models/product');

var csrfProtection = csrf();
router.use(csrfProtection);
/* GET home page. */
router.get('/', function(req, res, next) {

res.render('shop/index', { title: 'Shopping Cart' });


});

router.get('/user/signup',function(req, res, next){
res.render('user/signup',{csrfToken: req.csrfToken()});

})

router.post('/user/signup', passport.authenticate('local.signup', {

successRedirect: '/user/profile',
failureRedirect: '/user/signup',
failureFlash: true

}));

router.get('/user/profile', function(req, res, next){
res.render('user/profile');
})

module.exports = router;

User/signup.hbs

<div class="row">
 <div class="col-md-4 col-md-offset-4">
  <h1>Sign Up</h1>
    Validation Errors
    <form action="/user/signup" method="post">
     <div class="form-group">
      <label for="email">E-Mail</label>
     <input type="text" id= "email" name="email" class="form-control">
     </div>
     <div class="form-group">
        <label for="password">Password</label>
        <input type="password" id= "password" name="password" class="form-
          control">
    </div>
  <input type="hidden" name="_csrf" value=>
  <button type="submit" class="btn btn-primary">Sign Up</button>
    </form>
 </div>
 </div>

via anant