Проверка формы с помощью fla sh сообщений в express js - PullRequest
Новая
       130

Проверка формы с помощью fla sh сообщений в express js

0 голосов
/ 09 мая 2020

Я пытаюсь проверить форму в express js, прежде чем размещать ее на mongodb, который я использую как бэкэнд. Мой пользователь. js для страницы регистрации выглядит примерно так - 

router.post('/register', (req, res) => {
userreg.register(
// eslint-disable-next-line new-cap
new userreg({
  firstname: req.body.firstname,
  lastname: req.body.lastname,
  username: req.body.email,
  usn: req.body.usn, // validate so that no space is taken or else request modal wont work
  course: req.body.course,
}),
req.body.password,
(err) => {
  if (err) {
    console.log(err);
    res.render('register', { user: 'error' });
  } else {
    console.log('no error');
    res.render('submit-success', { username: req.body.firstname });
  }
}
);
});

, а мой register.e js выглядит примерно так - 

<form class="user" action = '/users/register' method="POST">
            <div class="form-group row">
              <div class="col-sm-6 mb-3 mb-sm-0">
                <input type="text" class="form-control form-control-user" id="exampleFirstName" name="firstname" placeholder="First Name">
              </div>
              <div class="col-sm-6">
                <input type="text" class="form-control form-control-user" id="exampleLastName" name="lastname" placeholder="Last Name">
              </div>
            </div>
            <div class="form-group">
              <input type="email" class="form-control form-control-user" id="exampleInputEmail" name="email" placeholder="Email Address">
            </div>
              <div class="form-group">
                <input type="text" class="form-control form-control-user" id="exampleInputUSN" name="usn"  placeholder="USN">
              </div>
              <div class="form-group">
                <select class=" form-control selectpicker" name="course">
                  <optgroup label="Course"></optgroup>
                    <option selected hidden disabled>Course</option>
                    <option value="mca">Computer Applications</option>
                    <option value="mba">Business Administration</option>
                  </optgroup>
                </select>
              </div>
            <div class="form-group">
                <input type="password" class="form-control form-control-user" id="exampleInputPassword" name="password" placeholder="Password">
            </div>
            <div class="text-center">
              <input type="submit" class = "btn btn-primary btn-user" value="Register">
            </div>
          </form>

Просматривая множество источников на inte rnet (так как я очень новичок в express js и делаю это как часть моего проекта в колледже, и поскольку я не могу консультироваться с учителями за помощью во время блокировки), я получил чтобы знать, что часть проверки должна быть реализована в user. js. Пожалуйста, помогите мне с кодом для проверки, а также отображением сообщений fla sh, если поле пусто хотя бы для одного поля, чтобы я мог иметь начало как минимум.

Заранее спасибо

EDIT:

Я использовал express -validator и получил следующие изменения - 

var flash = require('connect-flash');
var app = express();

app.configure(function () {
app.use(express.cookieParser('keyboard cat'));
app.use(express.session({ cookie: { maxAge: 60000 } }));
app.use(flash());
});




app.get('/flash', function (req, res) {
// Set a flash message by passing the key, followed by the value, to 
req.flash().
req.flash('info', 'There is an Error!')
res.redirect('/');
});

app.get('/', function (req, res) {
// Get an array of flash messages by passing the key to req.flash()
res.render('index', { messages: req.flash('info') });
});

const { check, validationResult } = require('express-validator');

router.post('/register', [
check('firstname', 'Please enter your first 
name').exists().trim().escape().not().isEmpty(),
check('lastname', 'Please enter your last 
name').exists().trim().not().isEmpty(),
check('username', 'Please enter an 
email').exists().trim().not().isEmpty(),
check('usn', 'Please enter USN').exists().trim().not().isEmpty(),
check('course', 'Please enter Course').exists().trim().not().isEmpty(),
check('password', 'Please enter 
password').exists().trim().not().isEmpty(),

], (req, res) => {
const errors = validationResult(req);
if (!errors.isEmpty()) {
req.flash('message', `${errors}`);
res.redirect('/users/register');
} else {
userreg.register(
  // eslint-disable-next-line new-cap
  new userreg({
    firstname: req.body.firstname,
    lastname: req.body.lastname,
    username: req.body.email,
    usn: req.body.usn, // validate so that no space is taken or else 
    request modal wont work
    course: req.body.course,
    })),


  res.render('submit-success', { username: req.body.firstname });
  }

  }
  );

И в результате вызывается if (! Errors.isEmpty ()), но сообщение fla sh не отображается. Мне что-то еще не хватает?

1 Ответ

0 голосов
/ 09 мая 2020

https://express-validator.github.io/docs/check-api.html

const { check, validationResult } = require('express-validator');

router.post('/register', [
   check('firstname', 'Please enter your first name').exists().trim().escape().not().isEmpty(),
   check('lastname', 'Please enter your last name').exists().trim().not().isEmpty(),
   check('email', 'Please enter an email').exists().trim().not().isEmpty(),
   ....
], (req, res) => {
const errors = validationResult(req);
if (!errors.isEmpty()) {
   req.flash('message', `${errors}`);
   res.redirect('register');
} else {
  <Your Code Here>
}})

Я предполагаю, что вы используете connect-fla sh

Дополнительные примечания: вы можете хотите создать промежуточное ПО для обработки ошибок проверки, чтобы сделать ваш код более чистым.

...