Проверить WTForm после того, как выбор поля выбора динамически обновляется с помощью jqueryJquery

Программирование на jquery
Ответить
Гость
 Проверить WTForm после того, как выбор поля выбора динамически обновляется с помощью jquery

Сообщение Гость »


Я создаю приложение Flask и создал форму с помощью WTForms. Форма имеет два поля SelectField (раскрывающиеся списки) и кнопку отправки. Я бы хотел, чтобы раскрывающиеся списки были динамическими - по сути, пользователь выбирает вариант из раскрывающегося списка A, это запускает запрос к базе данных в фоновом режиме, который возвращает варианты для раскрывающегося списка B.

Я нашел для этого несколько хороших решений
[*]Например, в этом видео на YouTube показано, как использовать JavaScript + WTForms для достижения этой цели [*]и в этом вопросе stackoverflow используются jquery и обычные формы.
В итоге я использовал второй ответ на связанный вопрос о stackoverflow для моделирования своего решения. Основная идея заключается в том, что jquery вызывает конечную точку flask, которая выполняет запрос к базе данных и возвращает новые параметры раскрывающегося списка, которые заполняются динамически.

Я хочу выполнить дополнительную обработку после отправки формы, и для этого я использую if form.validate_on_submit(): в конечной точке индекса, чтобы обернуть дополнительную обработку и проверить форма. Ни один из ответов на этот вопрос, которые я нашел, не пытался подтвердить форму. Проблема в том, что поле choices в раскрывающемся списке B теперь недействительно. Я начал с некоторых значений по умолчанию, которые ожидает функция валидатора, а затем динамически обновил варианты с помощью jquery, не обновляя их. Как описано в решении, запрос к базе данных обрабатывается в конечной точке, отличной от конечной точки индекса, где я проверяю проверку формы, поэтому у нее нет доступа к этим новым вариантам для их заполнения.

Как лучше всего обновить параметры формы в конечной точке индекса (после обновления вариантов), чтобы форма была действительна при отправке?

Некоторые фрагменты кода

jquery (в основном скопировано из связанного ответа stackoverflow)

$(документ).ready(функция() { $('#dropdown_one').change(function(){ $.getJSON('/_update_dropdown', { выбранный_класс: $('#dropdown_one').val() }).done(функция(данные) { $('#dropdown_two').html(data.html_string_selected); }) }); }); класс формы

Форма класса (FlaskForm): dropdown_one = SelectField("Выберите вариант", choices = [options]) dropdown_two = SelectField("Выберите вариант на основе первого раскрывающегося списка") submit = SubmitField("Отправить") конечная точка индекса Python/flask

@bp_views.route('', методы=["POST", "GET"]) индекс защиты(): форма = Форма() form.dropdown_two.choices = [(Нет, «Сначала выберите элемент в первом раскрывающемся списке»)] # значение по умолчанию для второго раскрывающегося списка если form.validate_on_submit(): # дальнейшая обработка # эта проверка не удалась, потому что варианты выбора были обновлены по сравнению со значениями по умолчанию, и выбор недействителен. вернуть render_template('index.html', form=form) Конечная точка обновления Python/flask (в основном скопирована из связанного ответа на stackoverflow
@bp_views.route('/_update_dropdown') защита update_dropdown(): # значение первого раскрывающегося списка (выбранного пользователем) selected_class = request.args.get('selected_class', type=str) # получаем значения для второго раскрывающегося списка обновленные_значения = db.fetch_data(выбранный_класс) # создаем значение в раскрывающемся списке как строку html html_string_selected = '' для записи в обновленных_значениях: html_string_selected += '{}'.format(entry, enter) return jsonify(html_string_selected=html_string_selected)
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Jquery»