document.getElementsByName возвращает неопределенное

Question

Я новичок в python flask и MVC.

Я пытаюсь распечатать выбранный параметр в раскрывающемся списке.

Это мой список в. Функция py.

@app.route('/', methods=['GET'])
def dropdown2():
    model2 = [
        {'id': '1', 'quarter': 'Q1'},
        {'id': '2', 'quarter': 'Q2'},
        {'id': '3', 'quarter': 'Q3'},
        {'id': '4', 'quarter': 'Q4'}
             ]

Это моя база. html код.

            </div>
            <select name= quarters method="GET" action="/" onchange="myFunction3()">
                {% for m2 in model2 %}
                <option value= "{{m2.quarter}}" SELECTED>{{ m2.quarter }}</option>"
                {% endfor %}
            </select>

            <p name="quarters"></p>
            function myFunction3() {
              var x = document.getElementsByName("quarter"s).value;
              document.getElementsByName("quarters").innerHTML = "<span style='color: blue;'>Period: </span>" + x;
            }

В настоящее время он возвращает мой внутренний HTML и неопределенный. Например, период: не определено

Любая помощь будет оценена, спасибо!

Answer 1

Вместо:

<select name= quarters
<option value= "{{m2.quarter}}" SELECTED>{{ m2.quarter }}</option>"

do:

<select name="quarters"
<option value="{{m2.quarter}}" selected>{{ m2.quarter }}</option>

Первый - это неправильно определенный атрибут. Атрибуты элементов должны иметь следующий формат: attributeName="value".

Вместо:

var x = document.getElementsByName("quarter"s).value;

Do:

let quarters = document.getElementsByName("quarters")
let quarter = quarters[0];
let x = quarter.value;

getElementsByName возвращает список, так что вам нужно сначала извлечь элемент;