Question

我正在开发一个简单的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>

Answer 1

在IDE中运行调试器，在add_site中设置断点（）并逐行去找出函数返回null的原因。我猜你的验证码就在附近......

Answer 2

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

在脚本中替换以下内容：

from abc import ABC, abstractmethod
class Base(ABC):
    def __init__(self, value):
        self.value = value

    def convert_child_classes(self, newclass):
        newvalue, newattr = self.MakeUsableInNewclass()
        return newclass(newattr, newvalue)

    @abstractmethod
    def MakeUsableInNewclass(): pass

class Child1(Base):
    def __init__(self, subclassattr, value):
        super(Child1, self).__init__(value)
        self.subclassattr = subclassattr

    def MakeUsableInNewclass(self):
        newvalue = self.value #do operations
        newattr = self.subclassattr #do operations
        return newvalue, newattr

class Child2(Base):
    def __init__(self, subclassattr, value):
        super(Child2, self).__init__(value)
        self.subclassattr = subclassattr

    def MakeUsableInNewclass(self):
        newvalue = self.value #do operations
        newattr = self.subclassattr #do operations
        return newvalue, newattr

具有：

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

此处有更多信息-Jquery Event Not Triggering for DOM Elements Created after page load

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

2 个答案: