我在引导模式中有一个非常小的表单,仅包含两个字段:一个 TextAreaField 和一个 Submit 按钮。我的 TextAreField 是所需数据.
最重要的是,该字段使用 CKEditor(类似于 quillsJS)来使文本区域所见即所得。
问题是,即使没有输入数据,表单也会提交,并重新加载父页面。
我非常想知道如何防止表单提交并在未输入数据时引发验证错误。
我想获得 WTForm 验证,而不是浏览器的验证(无论如何对于这种情况都不起作用)。
我还应该提到,如果重要的话,我的模式是一个部分文件(jinja)。
我的模式触发点是这样的,住在perfume-cursor.html
<a href="{{ url_for('perfumes.edit_perfume', perfume_id=perfume._id) }}" class="btn btn-primary btn-sm mt-2">Edit</a>
这是我的模态(在部分文件中perfume-modals.html
)
<div class="modal fade" id="reviewPerfumeModal" tabindex="-1" role="dialog" aria-labelledby="reviewPerfumeModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteUserModal">Please Leave a Review</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method=POST action="{{ url_for('reviews.review_perfume', perfume_id=perfume._id) }}" id="form-review">
<fieldset class="form-group">
<div class="form-group">
{{ form.review(class="form-control form-control-md", placeholder="Review", id="description") }}
</div>
</fieldset>
<div class="modal-footer">
<div class="form-group">
{{ form.submit(class="btn btn-primary") }}
</div>
</div>
</form>
</div>
</div>
</div>
</div>
The id="description"
顺便说一句,CKEditor 用来将文本区域字段呈现为所见即所得编辑器。
我真的非常感谢任何帮助!
提前致谢!
Update:
如果它有帮助的话,这是我的表单类,尽管我很确定问题与模式相关,而不是 WTF 相关:
class AddReviewForm(FlaskForm):
review = TextAreaField("Review", validators=[DataRequired()])
submit = SubmitField("Post Review")