验证失败后重新提交表单时，Flask-wtf 丢失变量值答案

【问题标题】：Flask-wtf losing value of variable when form is resubmitted after failing validation验证失败后重新提交表单时，Flask-wtf 丢失变量值
【发布时间】：2017-10-12 13:45:50
【问题描述】：

我正在开发一个简单的 Flask 应用程序，该应用程序利用由 JavaScript 启动的 Bootstrap 模态表单。

使用Flask-WTF 和一些字段验证，只要填写了所有必填字段，我就可以提交表单。

但是，如果存在验证错误，则在更正后，表单将无法正确提交。
我得到一个“405 - 不允许的方法”，因为它试图回发给自己。

我不明白为什么我会丢失我的“url”变量，因为它被设置为null。非常感谢任何见解。

脚本：

    $(document).ready(function() {
  // add device button opens modal containing device form loaded via ajax
    $('#addSiteBtn').click(function() {
      var url = "{{ url_for('core.add_site') }}";
      $.get(url, function(data) {
        $('#siteDialog .modal-content').html(data);
        $('#siteDialog').modal();

        $('#submit').click(function(event) {
          event.preventDefault();
          $.post(url, data=$('#siteForm').serialize(), function(data) {
            if (data.status == 'ok') {
              $('#siteDialog').modal('hide');
              location.reload();
            }
            else {
              $('#siteDialog .modal-content').html(data);
            }
          });
        })
      });
    });
  });

查看：

@core.route('/sites/add/', methods=['GET', 'POST'])
@login_required
def add_site():

    add_site = True
    site_form = SiteForm()

    if site_form.validate_on_submit():
        site = Site(name = site_form.name.data,
                    descr = site_form.description.data,
                    addr_01 = site_form.address_01.data,
                    addr_02 = site_form.address_02.data,
                    city = site_form.city.data,
                    state = site_form.state.data,
                    zip = site_form.zip.data,
                    phone = site_form.phone.data,
                    fax = site_form.fax.data
                    )

        try:
            db.session.add(site)
            db.session.commit()
            flash('Site successfully added.')
        except:
            flash('Error: Site already exists.')

        #return redirect(url_for('core.list_sites', page=1))
        return jsonify(status='ok')

    return render_template('core/sites/add-edit-site.html',
                            add_site = add_site,
                            site_form = site_form,
                            title = "Add Site")

表格：

{% import "bootstrap/wtf.html" as wtf %}

  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="close">
      <span aria-hidden="true">&times;</span>
    </button>
    <h3 class="modal-title">
    {% block title %}
    {{ title }}
    {% endblock %}
  </h3>
  </div>
  <div class="modal-body">
    <form id="siteForm" name="siteForm" class="form" method="post">
    {{ wtf.quick_form(site_form) }}
    </form>
  </div>

【问题讨论】：

标签： jquery python flask bootstrap-modal flask-wtforms

【解决方案1】：

在 IDE 中运行调试器，在 add_site 中设置断点 () 并逐行找出您的函数返回 null 的原因。我的猜测是在您的验证码附近...

【讨论】：

【解决方案2】：

我是初学者，遇到了完全相同的问题。在线研究后，似乎在第一次提交后，Jquery 在后续提交时无法正确运行。

在您的脚本中替换以下内容：

$('#submit').click(function(event) {

与：

$(document).on('click', 'input[name="submit"]', function(event) {

【讨论】：