CODEWITHSUNDEEP
jqueryajaxnode.jsexpress
user5232061
user5232061

Reputation: 27

Ajax post wont render/send page, node & express

So I'm trying to make ajax post a request to the server to render a new page.

       $('#statistics').click(function () {
        $.ajax({url:'profile',
            type:'POST',
            success:function(){console.log("Success!");
            }});
        });

Which then reaches.

profile.js

router.post('/',function(req,res,next){
    res.redirect('statistics');
});

Whom in turn reaches.

statistics.js

router.get('/', function(req, res, next) {
    res.send("wat up");
});

I get no errors from what I can see and I'm confident that it passes through all the code that I've given here because when I put a bunch of console.logs in the post of profile.js and get of statistics.js they all printed. Yet when I click on the p element nothing seems to happen. The browser is stuck in the same page.

Edit:

App.js

var express = require('express');
var helmet = require('helmet');
var csrf = require('csurf');
var path = require('path');
var favicon = require('serve-favicon');
var flash = require('connect-flash');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var session = require('express-session');



var routes = require('./routes/index');
var users = require('./routes/users');
var profile = require('./routes/profile');
var statistics = require('./routes/statistics');

var app = express();


// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));

app.use(logger('dev'));

//Security shyts

app.use(helmet());
app.use(helmet.xssFilter({ setOnOldIE: true }));
app.use(helmet.frameguard('deny'));
app.use(helmet.hsts({maxAge: 7776000000, includeSubdomains: true}));
app.use(helmet.hidePoweredBy());
app.use(helmet.ieNoOpen());
app.use(helmet.noSniff());
app.use(helmet.noCache());

// rest of USE
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(session({secret: 'anystringoftext', saveUninitialized: true, resave: true, httpOnly: true, secure: true}));
app.use(csrf()); // Security, has to be after cookie and session.
app.use(flash());
app.use(express.static(path.join(__dirname, 'public')));

// csrfToken usage
app.use(function (req, res, next) {
  var token = req.csrfToken();
  res.locals.csrfToken = token;
  next();
});

app.use('/', routes);
app.use('/users', users);
app.use('/profile', profile);
app.use('/statistics', statistics);

// catch 404 and forward to error handler

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

// error handlers

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});


module.exports = app;

Upvotes: 1

Views: 1193

Answers (1)

beautifulcoder
beautifulcoder

Reputation: 11340

Really, it should not be an Ajax request at all:

<form action="profile" method="post">
    <input type="submit" value="Statistics">
</form>

Ajax will not redirect the browser on a 303 response. You can do so yourself through document.location, but, the browser already handles this for you without Ajax. No need to reimagine warm water.

Upvotes: 1

Related Questions