1

I have a sign up form that I want to re-populate with the user entered data when the form is submitted but has errors in them. I am using express-validator and connect-flash to check / show error messages. I can't seem to figure out a way to pass the original values back to repopulate the field.

Here's my route:

router.post('/edit',
    // Input validation
    function(req, res, next) {

        req.checkBody('username', 'Username cannot be empty').trim().notEmpty();

        var errors = req.validationErrors(true);
        if (errors) {
            req.flash('validation', errors);
            res.redirect('/vendor/edit/'));
        } else {
           //Add to DB
        }
    });

Here is where I either load the original form, or where it gets redirected to show the form with error messages. :

router.get('/edit', function(req, res) {
    res.render('vendor_edit', {
        validation: req.flash('validation')[0],
        error: req.flash('error')[0],
    });
});

However, the form is blank when it gets redirected since my template doesn't have the original values, or I don't know how to access them if they are naturally passed? - I am trying to render in PUG.

TheBear
  • 827
  • 2
  • 10
  • 21
  • The easiest way to keep form values intact, is to make an ajax call to the server with the form data, validate, return validation errors if any and then render those errors on the browser – Swaraj Giri Jan 09 '19 at 06:20
  • Is there not a way to do this using the express technology stack? I didn't realize the whole framework was so under-developed? – TheBear Jan 09 '19 at 06:30
  • This has pretty less to do with express but more with the stateless nature of http. You can still do this with express, just pass the form values to the template and render them conditionally. – Swaraj Giri Jan 09 '19 at 11:53
  • So it looks like Express does allow you to pass data to different routes. You must need to amend the code into middleware format, alternatively can put the data into the flash-connect plugin. But the latter solution requires a little more code if you require more than just text to be carried over. I have posted the solution below. – TheBear Jan 11 '19 at 01:28

1 Answers1

0

This is made possible via this post: How do I redirect in expressjs while passing some context?

For the lazy, here is the copy and paste of the code from the above link, it worked like a charm for me.

var express  = require('express');
var jade     = require('jade');
var http     = require("http");


var app    = express();
var server = http.createServer(app);

/////////////
// Routing //
/////////////

// Move route middleware into named
// functions
function homeCtrl(req, res) {

    // Prepare the context
    var context = req.dataProcessed;
    res.render('home.jade', context);
}

function categoryCtrl(req, res, next) {

    // Process the data received in req.body
    // instead of res.redirect('/');
    req.dataProcessed = somethingYouDid;
    return next();
    // optionally - Same effect
    // accept no need to define homeCtrl
    // as the last piece of middleware
    // return homeCtrl(req, res, next);
}

app.get('/', homeCtrl);

app.post('/category', categoryCtrl, homeCtrl);
TheBear
  • 827
  • 2
  • 10
  • 21