使用selectfield烧瓶链式下拉列表不是一个有效的选择

Question

我被困在我当前的项目中，因为我在链式下拉场景中收到“非有效选择”错误消息。我有2个下拉字段区域和区域，但只在字段上收到错误消息。无论是选择了字段还是使用默认选项。提前致谢

我已经定义了这样的类：

class RegistrationDDForm(FlaskForm):
    region = SelectField(u'Region', choices=(), coerce=int)
    area = SelectField(u'Area', choices=(),coerce=int)
    submit = SubmitField('Sign Up')

我的路线和功能定义如下：

@users.route("/finish_registration", methods=['GET', 'POST'])
def finish_registration():
    cur = mysql.connection.cursor()
    result1 = cur.execute("select * from region")
    results = cur.fetchall()

    form = RegistrationDDForm(request.form)
    form.region.choices = [('0', 'Select Region')] + 
        [(x['region_id'], x['region']) for x in results]

    if form.validate_on_submit():
        # Eventually add data to database table
        pass

    return render_template('finish_registration.html', title='Register', form=form)

@users.route("/finish_registration/<int:region_id>/", methods=["GET"])
def get_request(region_id):

    cur = mysql.connection.cursor()
    results = cur.execute("select * from area where region_id=%s", region_id])
    results = cur.fetchall()

    data = [('0', 'Select Area')] + 
        [(x['area_id'], x['area']) for x in results
        if x['region_id'] == region_id]

    response = make_response(json.dumps(data))
    response.content_type = 'application/json'
    return response

我的javascript函数：

$(function() {
  // disable refresh button
  $("#refresh-btn").prop("disabled", true)
  $("#area_select").show();

  $("#region_select").change(function() {
    var region_id = $("#region_select").val();
    var get_request = $.ajax({
      type: 'GET',
      url: '/finish_registration/' + region_id + '/',
    });

    get_request.done(function(data){
      var option_list = data;
      $("#area_select").empty();
      for (var i = 0; i < option_list.length; i++) {
        $("#area_select").append(
          $("<option></option>").attr("value", option_list[i][0]).text(option_list[i][1]));
      }
    });
  });

我的html页面中的部分片段：

<form method="POST" action="">
    {{ form.csrf_token }}
    <fieldset class="form-group">
      <div class="form-group">
        {{ form.region.label(class="form-control-label") }}
        {{ form.region(id="region_select", class="form-control form-control-sm") }}
      </div>
      <div class="form-group">
        {{ form.area.label(class="form-control-label") }}
        {{ form.area(id="area_select", class="form-control form-control-sm") }}
      </div>
    </fieldset>
    <div class="form-group">
      {{ form.submit(class="btn btn-outline-info btn-sm btn-block") }}
    </div>
  </form>

Answer 1

您还必须在验证前填写form.area.choices。或者区域没有有效的选择......所以如果你的表单提供了错误信息，你就会收到错误信息。

@users.route("/finish_registration", methods=['GET', 'POST'])
def finish_registration():
    cur = mysql.connection.cursor()
    result1 = cur.execute("select * from region")
    results = cur.fetchall()

    form = RegistrationDDForm(request.form)
    form.region.choices = [('0', 'Select Region')] + 
        [(x['region_id'], x['region']) for x in results]

    if request.method == 'POST':
        cur = mysql.connection.cursor()
        results = cur.execute("select * from area where region_id=%s", request.form.region_id)
        results = cur.fetchall()

        # Add choices to area to allow validation
        form.area.choices = [(x['area_id'], x['area']) for x in results]

        if form.validate():
            # Eventually add data to database table
            pass

    return render_template('finish_registration.html', title='Register', form=form)