保持模式打开，显示 WTForms 验证错误

Question

我有一个 DataRequired 表单 (WTForms)。这种形式存在于模态中。它只是一个文本区域字段，我有 CKEditor 处理它，因此它显示为所见即所得的小文本区域。 我在表单中添加了属性“novalidate”，因为我希望 WTForms 的验证错误能够提供反馈，而不是浏览器中内置的丑陋弹出窗口。

问题：当我按下提交而不输入任何文本时，我的模式关闭。 是否有任何 jQuery/JS 方法来保持模态打开显示验证错误，而不是让模态关闭并在验证错误反馈给用户之前刷新页面？

这是我的模态表单：

<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="reviewPerfumeModal">Please Leave a Review</h5>
            </div>
            <div class="modal-body">
                <form method=POST action="{{ url_for('reviews.review_perfume', perfume_id=perfume._id) }}" id="form-review">
                    {{ add_review_form.hidden_tag() }}
                    <fieldset class="form-group">
                        <div class="form-group">
                            {% if add_review_form.review.errors %}
                            {{ add_review_form.review(class="form-control form-control-md is-invalid")}}
                            <div class="invalid-feedback">
                                {% for error in add_review_form.review.errors %}
                                <span>{{ error }}</span>
                                {% endfor %}
                            </div>
                            {% else %}
                            {{ add_review_form.review(class="form-control form-control-md ckeditor", placeholder="Review")}}
                            {% endif %}
                        </div>
                    </fieldset>
                    <div class="modal-footer">
                        <div class="form-group">
                            {{ add_review_form.submit(class="btn btn-primary")}}
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

P.S.：如果表单不在模式上，这工作得很好。我只想保持模式打开显示错误。

谢谢！！

Answer 1

我对这个话题了解不多，但试试这个：

{% if add_review_form.review.errors %}
<script>
  javascriptFunctionToOpenModal();
</script>
{% endif %}