如何在没有提交按钮的 Flask 中通过下拉选择发送 POST 请求？答案

【问题标题】：How to send POST request upon dropdown selection in Flask without Submit button?如何在没有提交按钮的 Flask 中通过下拉选择发送 POST 请求？
【发布时间】：2021-11-21 10:53:49
【问题描述】：

我的 html 页面中有以下下拉表单，用于对页面结果进行排序。我想在用户单击一个选项而不是用户必须选择一个选项时向我的 Flask 应用程序发送一个发布请求，然后单击“订购”按钮以发送发布请求。

我怎样才能做到这一点？

HTML 代码：

        <form method="POST" action="">
            <select class="btn btn-primary btn-sm dropdown-toggle" name="order-by" id="order" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <option value="Default" {% if order_by==None %} selected {% endif %}>Default</option>
                <option value="Recent" {% if order_by =="Recent" %} selected {% endif %}>Recent</option>
                <option value="Alphabetically (A-Z)" {% if order_by=="Alphabetically (A-Z)" %} selected {% endif %}>Alphabetically (A-Z)</option>
                <option value="Alphabetically (Z-A)" {% if order_by =="Alphabetically (Z-A)" %} selected {% endif %}>Reverse Alphabetically (Z-A)</option>
                <option value="Follower Count (High-Low)" {% if order_by =="Follower Count (High-Low)" %} selected {% endif %}>Follower Count (High to Low)</option>
                <option value="Follower Count (Low-High)" {% if order_by =="Follower Count (Low-High)" %} selected {% endif %}>Follower Count (Low to High)</option>
                <option value="Random" {% if order_by =="Random" %} selected {% endif %}>Random</option>
            </select>
            <input class="btn btn-primary btn-sm" type="submit" value="Order">
        </form>

烧瓶路线：

@app.route("/results", methods=["GET", "POST"])
@login_required
def results():
    order_by = None
    results = get_results(order_by)
    if request.method == "POST":
        order_by = request.form["order-by"]
        curators = get_results(order_by)
    return render_template("results.html", title="Results", results=results, order_by=order_by)

【问题讨论】：

标签： python html flask jinja2

【解决方案1】：

你可以用 js 做到这一点。添加 onchange 事件以选择元素并在此功能上使用 POST 重新加载页面。

您可以查看以下页面：

对于更改：https://www.w3schools.com/jsref/event_onchange.asp
要重新加载帖子：AJAX reload page with POST

【讨论】：