如何在Flask中获取HTML属性？

Question

我正在给我的网站添加一个功能，这个功能需要用到图标，所以我把一些来自 Font Awesome 的图标放在了一个按钮里。

<button id="iconDiv1" class="iconBtn" type="button" value="fa-solid fa-heart fa-xl" >
<i class="fa-solid fa-heart fa-2xl" class="icons"></i>
</button>
        <button id="iconDiv2" class="iconBtn" type="button" value="fa-solid fa-gamepad fa-xl">
<i class="fa-solid fa-gamepad fa-2xl" class="icons">
</i></button>
        <button id="iconDiv3" class="iconBtn" type="button" value="fa-solid fa-chess-knight fa-xl">
<i class="fa-solid fa-chess-knight fa-2xl" class="icons"></i>
</button>
        <button id="iconDiv4" class="iconBtn" type="button" value="fa-solid fa-hand-fist fa-xl">
<i class="fa-solid fa-hand-fist fa-2xl" class="icons"></i>
</button>
        <button id="iconDiv5" class="iconBtn" type="button" value="fa-solid fa-mug-hot fa-xl">
<i class="fa-solid fa-mug-hot fa-2xl" class="icons"></i>
</button>

然后，我用 JavaScript 给这个选中的按钮/图标添加了一个名字属性，现在我需要把按钮的值 value="fa-solid fa-heart fa-xl（也就是里面的图标类）存到数据库里，使用的是 Flask 框架，但我不知道怎么在 Flask 中获取这个按钮的值属性，而不使用 JavaScript。

我搜索了很多答案，但没有找到合适的。我还尝试写了 icon = request.form.get("selected").getattr("value")，但没有成功。然后我又试着在 Flask 中写 icon = request.form["selected"].__getattribure__("value")，结果也不行。

Answer 1

如果你的按钮不在一个表单里，你也可以把它们放在链接<a>标签里，然后把值传给你的服务器路由。

index.html

  <a href="{{ url_for('button', value='first') }}">
    <button>First Button</button>
  </a>
  <a href="{{ url_for('button', value='second') }}">
    <button>Second Button</button>
  </a>
  <a href="{{ url_for('button', value='third') }}">
    <button>Third Button</button>
  </a>

app.py

@app.route("/")
def index():
    return render_template("index.html")


@app.route("/button/<value>")
def button(value):
    return f"The button you clicked has the following {value=}!"

Answer 2

在一个表单里，输入框和按钮的值可以通过它们的名字来获取。其他的属性是服务器无法访问的。

所以你可以给按钮设置一个叫做 name 的属性。

<form method="POST">
    <button name="icon" type="submit" value="heart" >
        <i class="fa-solid fa-heart fa-2xl" class="icons"></i>
    </button>
    <button name="icon" type="submit" value="gamepad">
        <i class="fa-solid fa-gamepad fa-2xl" class="icons"></i>
    </button>
    <button name="icon" type="submit" value="chess-knight">
        <i class="fa-solid fa-chess-knight fa-2xl" class="icons"></i>
    </button>
    <button name="icon" type="submit" value="hand">
        <i class="fa-solid fa-hand-fist fa-2xl" class="icons"></i>
    </button>
    <button name="icon" type="submit" value="mug-hot">
        <i class="fa-solid fa-mug-hot fa-2xl" class="icons"></i>
    </button>
</form>

当表单被提交时，必须根据名字来请求这个属性的值，属性名是 value。

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