Проверяйте отправленную форму и корректно отображайте ошибки - PullRequest
0 голосов
/ 10 февраля 2019

Я пытаюсь проверить отправленную пользователем форму и показать значимые ошибки, но у меня много проблем.Прежде всего, моя форма (event_form.ejs):

<% if (typeof errors !== 'undefined') { %>
    <div class="message"><%= errors %></div>
<% } %> 

<form method="POST" action="/submit-create-event" id="create-event">
  <input type="text" class="title" name="title" placeholder="title">
  <input type="text" class="date" autocomplete="off" name="date" placeholder="date">
  <select class="type" name="type">
    <option value="road">Road</option>
    <option value="mtb">MTB</option>
  </select>
  <input type="text" class="city" name="city" placeholder="city">
  <select class="level" name="level">
      <option value="beginner">Beginner</option>
      <option value="advanced">Advanced</option>
      <option value="pro">Pro</option>
  </select>
  <input type="text" class="start-time timepicker" autocomplete="off" data-time-format="H:i" name="startTime" placeholder="start time">
  <input type="text" class="start_location" name="startLocation" placeholder="start location">
  <input type="text" class="distance" name="distance" placeholder="distance">
  <input type="submit" class="create-event-submit">
</form>

При отправке, в моем eventController.js есть функция обработки отправки.

//Helper function to handle event form submit.
module.exports.submitEventForm = function(req, res) {

  const event = new eventModel.event({
    title: req.body.title,
    date: req.body.date,
    type: req.body.type,
    city: req.body.city,
    level: req.body.level,
    start_time: req.body.startTime,
    start_location: req.body.startLocation,
    distance: req.body.distance
  });

  event.save(function(err, data) {
    if (err) {
      console.log(err);
      //I tried this, kinda works but pretty sure a bad practice
      res.render('forms/create_event_form', {errors: err})
    } else {
      res.render('status/success');
    }
  });
};

Как видите,на event.save() если у меня есть ошибки, я console.log() их на данный момент.Я попытался еще раз отрендерить мою event creation форму и отобразить ошибки (как видно из моего .ejs файла).Уверен, что так делать не следует.

Это мой model файл с одним validator

var mongoose = require('mongoose')
var validate = require('mongoose-validator')
var Schema = mongoose.Schema;


var titleValidator = [
  validate({
    validator: 'isAlphanumeric',
    message: 'Title should be alphanumeric'
  })
]

var eventSchema = new Schema({
  title: {type: String, required: true, validate: titleValidator},
  date: {type: String },
  type: {type: String },
  city: {type: String },
  level: {type: String },
  start_time: {type: String },
  start_location: {type: String },
  distance: {type: Number },
});

var Event = mongoose.model('Event', eventSchema);

module.exports.eventSchema = eventSchema;
module.exports.event = Event;

Я создал titleValidator, и если моя форма не работает, онраспечатывает что-то вроде этого:

Error message on incorrect tilte

Мои вопросы: Как правильно отправить свое validator сообщение в шаблон и отобразить его?Как обрабатывать несколько сообщений еще раз validators создаются, так как ошибки не возвращаются array способом, то есть я не могу их просмотреть?

1 Ответ

0 голосов
/ 10 февраля 2019

Кинда нашла решение.Чтобы сделать сообщения об ошибках более читабельными и удобными, я использовал Mongoose error helper .Он распечатывает все сообщения об ошибках аккуратно. Однако , при получении пакета через npm в коде есть ошибка, и запрос на получение создается для решения, но никогда не объединяется.Просто внесите это небольшое изменение вручную.

Я не смог найти другой способ рендеринга той же формы с ошибками, поэтому я придерживался этого:

event.save(function(err) {
    if (err) {
      res.render('forms/create_event_form', {errors: errorHelper(err, next)});
    } else {
      res.render('status/success');
    }
  }); 

и в своем шаблоне .ejs я печатаю ошибки следующим образом:

<% if (typeof errors !== 'undefined') { 
   errors.forEach(function(err) { %>
    <div class="message"><%= err %></div>
<% })} %> 

Надеюсь, это кому-нибудь поможет, ура.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...