首页 > 解决方案 > HTML表单(python,flask):有一个按钮向方法提交一个唯一的参数

问题描述

我现在有一个很好的 HTML 表单,它通过按钮调用方法。

我想要做的是创建几个调用相同方法的新按钮,但每个按钮都传递不同的参数。

具体用例是:我的按钮现在检索带有get_random_album().

我想做一个“爵士”、“古典”和“摇滚”按钮,分别调用get_random_album(genre=<genre>).

MVE:

from flask import Flask,redirect
# Below import commented out for MVE
# from discogs import get_random_album

# TODO: look at more advanced form builders

# Create app instance
app = Flask(__name__)

# Create homepage with button
@app.route("/")
def home():
    return """
    <html><body>
    <h2> Spin yo records </h2>
        <form action="/query">
            <input type='submit' value="I'm Feeling Lucky">
    </body></html>
    """

# Backend query to discogs
@app.route("/query")
def link():
    # return redirect(get_random_album())
    # Real implementation commented out
    # Scratch implementation here
    def get_random_album(genre=None):
        url = "https://www.google.com" 
        if genre == 'Jazz':
            return url + "/search?q=jazz"
        if genre == 'Classical':
            return url + "/search?q=classical"
        if genre == 'Rock':
            return url + "/search?q=rock"
        return url

    return redirect(get_random_album())
# Run app
if __name__ == "__main__":
    app.run(debug=True,port=600)

实际项目

标签: pythonhtmlflask

解决方案


首先创建相同name但不同的按钮value

@app.route("/")
def home():
    return """
    <html>
    <body>
    <h2> Spin yo records </h2>

        <form action="/query">
            <input type="submit" name="selected_genre" value="Jazz">
            <input type="submit" name="selected_genre" value="Classic">
            <input type="submit" name="selected_genre" value="Rock">
            <input type="submit" name="selected_genre" value="I'm Feeling Lucky">
        </form>
    </body>
    </html>
    """

接下来,您可以使用按钮中value使用的名称和名称进行选择request

from flask import request
import random

@app.route("/query")
def link():
    allowed_values = ('Jazz', 'Classic', 'Rock')

    genre = request.args.get("selected_genre")

    # "I'm Feeling Lucky"
    if genre not in allowed_values:
        genre = random.choice(allowed_values)

    genre = genre.lower()

    url = f"https://www.google.com/search?q={genre}" 

    return redirect(url)

完整示例

from flask import Flask, redirect, request
import random

app = Flask(__name__)

@app.route("/")
def home():
    return """
    <html>
    <body>
    <h2> Spin yo records </h2>

        <form action="/query">
            <input type="submit" name="selected_genre" value="Jazz">
            <input type="submit" name="selected_genre" value="Classic">
            <input type="submit" name="selected_genre" value="Rock">
            <input type="submit" name="selected_genre" value="I'm Feeling Lucky">
        </form>
    </body>
    </html>
    """


@app.route("/query")
def link():
    allowed_values = ('Jazz', 'Classic', 'Rock')

    genre = request.args.get("selected_genre")

    if genre not in allowed_values:
        genre = random.choice(allowed_values)

    genre = genre.lower()

    url = f"https://www.google.com/search?q={genre}" 

    return redirect(url)


if __name__ == "__main__":
    app.run(debug=True,port=600)

在以前的版本value中,它发送 url 即。/query?selected_genre=Rock- 所以每个人都可以看到它或者很容易它可以尝试使用自己的价值。这就是我过去allowed_values阻止它的原因。

要从 url 隐藏选定的流派,您必须使用:

  • <form ... method="POST">
  • @app.route(..., methods=['GET', 'POST'])(或methods=['POST']
  • request.form代替request.args

完整示例

from flask import Flask, redirect, request
import random

app = Flask(__name__)

@app.route("/")
def home():
    return """
    <html>
    <body>
    <h2> Spin yo records </h2>

        <form action="/query" method="POST">
            <input type="submit" name="selected_genre" value="Jazz">
            <input type="submit" name="selected_genre" value="Classic">
            <input type="submit" name="selected_genre" value="Rock">
            <input type="submit" name="selected_genre" value="I'm Feeling Lucky">
        </form>
    </body>
    </html>
    """

@app.route("/query", methods=['GET', 'POST'])
def link():
    allowed_values = ('Jazz', 'Classic', 'Rock')

    genre = request.form.get("selected_genre")

    if genre not in allowed_values:
        genre = random.choice(allowed_values)

    genre = genre.lower()

    url = f"https://www.google.com/search?q={genre}" 

    return redirect(url)


if __name__ == "__main__":
    app.run(debug=True, port=600)

如果您想在按钮上使用不同的文本但仍然发送相同的文本,那么value您可能需要隐藏但每个按钮都需要分开<input>value<form>

@app.route("/")
def home():
    return """
    <html>
    <body>
    <h2> Spin yo records </h2>

        <form action="/query" method="POST">
            <input type="hidden" value="Jazz" name="selected_genre">
            <input type="submit" value="The Best Jazz Music">
        </form>

        <form action="/query" method="POST">
            <input type="hidden" value="Classic" name="selected_genre">
            <input type="submit" value="The Best Classic Music">
        </form>

        <form action="/query" method="POST">
            <input type="hidden" value="Rock" name="selected_genre">
            <input type="submit" value="The Best Rock Music">
        </form>

        <form action="/query" method="POST">
            <input type="hidden" value="random" name="selected_genre">
            <input type="submit" value="I'm Feeling Lucky">
        </form>
    </body>
    </html>
    """

或者你必须使用<button>而不是<input>

@app.route("/")
def home():
    return """
    <html>
    <body>
    <h2> Spin yo records </h2>
        <form action="/query" method="POST">
            <button type="submit" name="selected_genre" value="Jazz">The Best Jazz Music</button>
            <button type="submit" name="selected_genre" value="Classic">The Best Classic Music</button>
            <button type="submit" name="selected_genre" value="Rock">The Best Rock Music</button>
            <button type="submit" name="selected_genre" value="random">I'm Feeling Lucky</button>
        </form>
    </body>
    </html>
    """

推荐阅读