Express js中带有Flash消息的表单验证

编程入门 行业动态 更新时间:2024-10-07 00:17:23

Express js中带有Flash消息的<a href=https://www.elefans.com/category/jswz/34/1771263.html style=表单验证"/>

Express js中带有Flash消息的表单验证

我正在尝试在Express js中验证表单,然后再将其发布到我用作后端的mongodb上。我的user.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.ejs看起来像这样-

<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>

[通过浏览互联网上的许多资源(因为我非常新来表达js,并且我将其作为大学项目的一部分进行即时通讯,并且由于在锁定期间我无法咨询任何老师的帮助),所以我得到了知道验证部分必须在user.js中实现。请为我提供验证代码,如果至少一个字段为空,则还显示Flash消息,以便我可以至少有一个开始。

提前谢谢您

回答如下:

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');
   <Your Code Here>
})

我假设您正在使用connect-flash

附加说明:您可能想创建中间件来处理验证,以使代码更整洁。

更多推荐

Express js中带有Flash消息的表单验证

本文发布于:2024-05-07 09:01:37,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1755515.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:表单   消息   Express   js   Flash

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!