如何使用龙卷风在前端显示错误

Question

这是我的网站联系表格的 python 文件。 主文件正在获取数据并将其发送到数据库。

 #main.py
    class next(tornado.web.RequestHandler):
    def get(self):
        self.render("contact.html")
    async def post(self):
        form = contact(self.request.arguments)
        name_ = form.data["name"]
        phone_ = form.data["phone"]
        email_ = form.data["email"]
        message_ = form.data["message"]
        image_ = form.data["pic"]
        print(name_, phone_, email_, message_, image_)

        try:

            dbsend = TestModel.create(name=name_, phone=phone_, email=email_,message=message_,image=image_)
            dbsend.save()
            print('done')
            self.render("contact.html")
        except:
            print('not done')

这是我认为所有验证代码都属于的文件

验证.py

from wtforms import *
from wtforms_tornado import Form
class contact(Form):
    name= StringField('name',[validators.required()])
    phone = StringField('phone', [validators.Length(min=4, message="too Short")])
    email = StringField('email', [validators.Length(min=4, message="too Short")])
    message = StringField('message', [validators.Length(min=4, message="too Short")])
    pic = StringField('pic', [validators.Length(min=4, message="too Short")])

这是包含表单的 HTML 页面。

contact.html

 <div class="row">
    <div class="col-lg-8 mb-4">
      <h3>Send us a Message</h3>
      <form name="sent" action="/contact" method="post" id="cForm" >
        <div class="control-group form-group">
          <div class="controls">
            <label>Full Name:</label>
            <input type="text"  name="name" >
            <p class="help-block"></p>
          </div>
        </div>
        <div class="control-group form-group">
          <div class="controls">
            <label>Phone Number:</label>
            <input  name="phone" >
          </div>
        </div>

        <div class=" ">
          <div class="">
            <label>Email Address:</label>
            <input   name="email">
          </div>
        </div>
        <div class="control-group form-group">
          <div class="controls">
            <label>Message:</label>
            <textarea rows="10" cols="100"  name="message" ></textarea>
          </div>
        </div>
        <div class="control-group form-group">
          <div class="controls">
            <label>Image:</label>
            <input type="file" name="pic" accept="image/*">
          </div>
        </div>
        <div id="success"></div>
        <!-- For success/fail messages -->
        <button type="submit" class="btn btn-primary" id="sendMessageButton">Send Message</button>
      </form>

    </div>

如何在电子邮件电话等上进行验证并在前端显示错误？

Answer 1

正如 WTForms 文档所述，you can use validate() method of a form-instance 运行验证器。所有错误都在form.errors 属性中。 You can insert errors messages into a HTML page by using a templating engine.