Блог

Главная - Вопросы по программированию - Python — использование ajax для отправки выбранного элемента из списка выбора в колбу

Python — использование ajax для отправки выбранного элемента из списка выбора в колбу

#python #ajax #flask

Вопрос:

Я пытаюсь написать небольшое веб-приложение, используя Flask. Но у меня есть вопрос при создании списка выбора. Например, в Интернете есть 2 списка выбора. Первый — «Идентификатор ключа», а второй — «Имя поля». Когда пользователь нажимает на элемент в списке выбора «Идентификатор ключа», появляется соответствующий список выбора «Имя поля».

Вот HTML-код:

         <div class="control">
            <label for="keyid">KeyID of parking spots:</label><br>
            <select name ="keyidList" id="keyid_list" style="width: 400px">
                {% for keyid in keyIDs %}
                    <option value ="{{keyid}}">{{keyid}}</option>
                {% endfor %}
            </select><br><br>
        </div>
        
        <div class="control">
            <label for="fieldname">FieldName of parking spots:</label><br>
            <select name ="fieldnameList" id="fieldname_list" style="width: 400px">
                {% for fieldname in fieldnames %}
                    <option value ="{{fieldname}}">{{fieldname}}</option>
                {% endfor %}
            </select><br><br>
        </div>

Код Javascript в HTML-файле

 <head>
<meta charset="utf-8">
<script>
  $(function(){
      var select_keyid = $('#keyid_list');
      var selected_keyid = select_keyid.val();

      select_keyid.on('change', function(){
         $.ajax({
            type: 'POST',
            data: JSON.stringify({
            'selected_keyid': selected_keyid,
            }),
            url: "{{ url_for('auth.get_fieldname_list') }}",
            success: function(data) {
                $("#fieldname").empty();
                for (var i = 0; i < data.length; i  ) {
                      $("#fieldname").append('<option value="'  fieldname  '">'   fieldname   '</option>');
                }
            }
         });
      });
    });
 </script>
</head>

А вот код колбы Python

 @auth.route('/get_fieldname_list', methods=['POST'])
def get_fieldname_list():
  req = request.json
  keyid = req.get('selected_keyid')
  fieldname = get_field_name_from_keyid(keyid)
  return fieldname

Лично я думаю, что проблема в коде ajax, но я не знаю, почему и как это исправить. Любой совет будет очень признателен.

Комментарии:

1. Привет, эта строка var selected_keyid = select_keyid.val(); должна быть внутри обработчика событий, иначе она будет принимать только первое значение .

2. @Swati, спасибо, но пока это все еще не работает вообще. Вы все равно знаете, как отлаживать javascript в html-файле? Я новичок в веб-разработке

3. проверьте консоль вашего браузера, если есть какие-либо ошибки . Также console.log(selected_keyid) внутри обработчика событий посмотрите, отображается значение или нет (это вы можете увидеть в консоли браузера) .

Метки: