如何使用龍卷風在前端顯示錯誤

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

這是我認為所有驗證代碼都屬於的文件

validation.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文檔所述， 您可以使用form-instance的validate()方法來運行驗證器。 所有錯誤都將在form.errors屬性中。 您可以使用模板引擎將錯誤消息插入HTML頁面。