выпадающий список в колбе с полем выбора

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)