How can I redirect a user back to the registration page, but with red asterisks next to required fields?

0
votes

My goal is simple. If a user is attempting to register and clicks "submit" before all required fields are full, I want to redirect him or her back to the registration page, but change it slightly so that a red asterisk appears next to each required field (this is an arbitrary and ugly choice, I know). I imagine I don't have to have a separate view just for this purpose. Is it possible to alter the registration view in this way?

In routes.js

// process the signup form
    app.post('/signup', passport.authenticate('local-signup', {
        successRedirect : '/profile', // redirect to the secure profile section
        failureRedirect : '/signup?missingFields=true', // redirect back to the signup page if there is an error
        failureFlash : true // allow flash messages
    }));

In signup.ejs

% if (req.params.missingFields) {%>
        BLAH
    <% } %>

I get an error in signup.ejs "req is not defined at eval" Here is the full error text:

ReferenceError: /home/adam/Documents/Node/node-authentication/views/signup.ejs:26 24| --> 25| >> 26| <% if (req.params.missingFields) {%> 27| BLAH 28| <% } %> 29| req is not defined at eval (eval at (/home/adam/Documents/Node/node-authentication/node_modules/ejs/lib/ejs.js:237:14), :31:825) at eval (eval at (/home/adam/Documents/Node/node-authentication/node_modules/ejs/lib/ejs.js:237:14), :31:2194) at /home/adam/Documents/Node/node-authentication/node_modules/ejs/lib/ejs.js:250:15 at Object.exports.render (/home/adam/Documents/Node/node-authentication/node_modules/ejs/lib/ejs.js:288:13) at View.exports.renderFile [as engine] (/home/adam/Documents/Node/node-authentication/node_modules/ejs/lib/ejs.js:318:20) at View.render (/home/adam/Documents/Node/node-authentication/node_modules/express/lib/view.js:76:8) at Function.app.render (/home/adam/Documents/Node/node-authentication/node_modules/express/lib/application.js:502:10) at ServerResponse.res.render (/home/adam/Documents/Node/node-authentication/node_modules/express/lib/response.js:777:7) at Object.handle (/home/adam/Documents/Node/node-authentication/routes/routes.js:35:7) at next_layer (/home/adam/Documents/Node/node-authentication/node_modules/express/lib/router/route.js:103:13)

3
node.jsexpress
why are mongodb and passport tags included? – Max
I'm using those and I thought there might be some package for either that I was unaware of that could help me. – michaelAdam

3 Answers

1
votes

First of all, you should be checking the data before you post or send your user over to another place. Once you deem the data to be correct and passed of all validation checks, you can post it.

You can use simple ajax to check the fields lively and put the asterisk next to the field.

If however for some reason you are unable to do so, you can redirect the user using

res.redirect('/path')

and to put the asterisk use

res.redirect('/path?errorInField1=true')

you can than get that data with req.params.errorInField1 and act appropriately

1
votes

Create an post method for the get method of the page. First install body parser to get the post values.

$ npm install --save body-parser

And then initialize it.

var bodyParser = require('body-parser')
app.use(bodyParser.json());
app.use(bodyParser.urlencoded());

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

Now validate the user input.

router.post('/register' function(req, res){
    var email = req.body.email;
    var name = req.body.name;
    ..... // Other required fields.
    if(email || name ...//Other variables to validate for null){
        req.flash('error', 'All the fields are required completing');
        req.redirect()
    }
});
0
votes

Do the validation in the client.

In my opinion,submit the request via ajax will be better,if you submit form,you have to redirect back when some error occur.