在引导 python 烧瓶中获取下拉选择的值答案

【问题标题】：Get the dropdown selected value in bootstrap python flask在引导 python 烧瓶中获取下拉选择的值
【发布时间】：2021-10-23 16:29:15
【问题描述】：

我有这个由 bootstrap 和几个选项组成的下拉菜单，我想用烧瓶获取所选值的数据。

HTML：

<div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle text-right " type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                age
            </button>
            <div class="dropdown-menu pre-scrollable" aria-labelledby="dropdownMenu3">
                {% for i in range(110) %}
                    <button class="dropdown-item text-right " type="button">{{i}}</button>
                {% endfor %}
            </div>
        </div>

Python：

from flask import Flask, render_template, request
def create_app():
    app = Flask(__name__)

    @app.route('/', methods=['POST', 'GET'])
    def home():


        return render_template("home.html")
     
    return app

【问题讨论】：

标签： python flask bootstrap-4 dropdown

【解决方案1】：

Bartosz 的回答是有效的，但下面的代码在不使用 Javascript 的情况下也是如此

html

<form method="POST" action="{{ url_for('test') }}">
<div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle text-right " type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                age
            </button>
            <div class="dropdown-menu pre-scrollable" aria-labelledby="dropdownMenu3">
                {% for i in range(110) %}
                    <button name = "age" value = {{i}} class="dropdown-item text-right " type="submit">{{i}}</button>
                {% endfor %}
            </div>
        </div>
    </form>

app.py

@app.route('/test', methods=['POST', 'GET'])
def test():
    if request.method == 'POST':
        print(request.form.get('age'))
    return render_template("test.html")

您需要将下拉 div 包装在 Form 中并指定其操作。

【讨论】：

这行得通，但我想用 bootstrap 设置它的样式，因为我不懂 CSS，我做了下拉菜单和所有内容，它只是不同。
我确实编辑了答案。另外，请承担下拉和其他输入方式的区别。下拉菜单类似于旧代码生成的下拉菜单，而您创建的不是下拉菜单。
好的，谢谢，最后一件事。我希望我选择的值不是“年龄”，它会等待点击按钮而不是自动获取它。
我不确定我是否了解您想要实现的目标。是否要突出显示选定的年龄，并且只有单击提交按钮才能检索年龄？
在这种情况下，您需要添加 javascript 来通知您所选按钮并突出显示它。

【解决方案2】：

创建一个带有下拉和按钮的表单，用于提交表单，然后创建提取所选选项的 js 脚本并通过 HTTP POST 方法将其发送到后端。

【讨论】：

我不懂javascript