Python 在Flask中使用Twitter引导单选按钮

我正在构建一个基于web的仪表板，我想使用中的单选按钮来帮助创建查询，然后对这些查询运行（via），然后使用新填充的数据刷新同一页面。我对构建基于网络的仪表板还不熟悉，所以请告诉我是否有更好的方法来实现这一点

{% extends "base.html" %}

{% block content %}
<div class="row">
    <div class="span4 offset4">
        <div class="well">
            <legend>Click me!</legend>
            <form method="POST" action="" accept-charset="UTF-8">
                {% if error %}
                    <div class="alert alert-error">
                        <a class="close" data-dismiss="alert" href="#">x</a>{{ error }}
                    </div>
                {% endif %}

                <div id="radios1" class="btn-group view-opt-btn-group" data-toggle="buttons-radio">
                    <button type="button" class="btn active" name="choice1" value="A">A</button>
                    <button type="button" class="btn" name="choice1" value="B">B</button>
                    <button type="button" class="btn" name="choice1" value="C">C</button>
                    <button type="button" class="btn" name="choice1" value="D">D</button>
                    <button type="button" class="btn" name="choice1" value="E">E</button>
                    <input type="hidden" name="choice1" value={{request.form['choice1']}} />
                </div>

                <script type="text/jscript">
                    $("body").find("#radios1").children().each(function () {
                        $(this).bind('click', function () {
                            $("input[name=choice1]").val(this.value);
                            });
                    });
                </script>

                <button class="btn-info btn" input type="submit">Submit</button>
            </form>
        </div>
    </div>
</div>
{% endblock %}

{%extends“base.html”%}
{%block content%}
点击我！
{%if错误%}
{{error}}
{%endif%}
A.
B
C
D
E
$（“body”）.find（#radios1”）.children（）.each（函数（）{
$（this）.bind（'click'，函数（）{
$（“input[name=choice1]”）val（this.value）；
});
});
提交
{%endblock%}

这将生成单选按钮，并使用JavaScript代码检测单击了哪个按钮，然后通过

request.Form

对象将数据发送回以进行处理

屏幕更新后，如何在每个按钮栏上设置活动框？我是否必须编写某种

{{if request.option1==？}}

块，然后为每个按钮定义

class=“btn active”

，或者是否有更聪明（或明显）的方法？另外，如何设置默认值/初始化条件？我应该在请求对象中预先填充相应的字段吗

---

另外，是否可以在不使用上面的JavaScript代码的情况下将所选框传递到Flask？

如果您有大量类似的控件，这是使用循环的最佳方式。让我们想象一下，我们使用列表来存储所有按钮名称，以及其他活动的按钮列表。这将为我们提供一些控制器：

from flask import render_template

@app.route('/form/')
def hello(name=None):
    return render_template('hello.html', buttons=['A', 'B', 'C'], active_btns=['A', 'C'])

因此，在模板中，我们将有如下内容：

<div id="radios1" class="btn-group view-opt-btn-group" data-toggle="buttons-radio">
{% for button in buttons %}
    {% if button in active_btns %}
        <button type="button" class="btn active" name="choice1" value="{{ button }}">{{ button }}</button>
    {% else %}
        <button type="button" class="btn" name="choice1" value="{{ button }}">{{ button }}</button>
    {% endif %}
{% endfor %}
</div>

{按钮%中的按钮为%s}
{%if按钮处于活动状态\u btns%}
{{按钮}
{%else%}
{{按钮}
{%endif%}
{%endfor%}

实际上，可以使用Jinja的If表达式简化for循环内部的表达式，并且应该如下所示：

<button type="button" class="btn{{" active" if button in active_btns}}" name="choice1" value="{{ button }}">{{ button }}</button>

{{button}

但我现在没有Jinja2，可能语法错误

---

如果我没有正确回答您的问题-请写一些评论，我将尝试更新我的答案：）

至于设置活动框，我不确定您的意思，但按钮标记属性可能会有所帮助。最初将字段留空可能是个好主意

您可以使用以下Flask代码将所选框传递到Flask，而不使用JavaScript（您的HTML当前设置正确，可以在按下Submit按钮时将请求传递到Flask）：

from flask import Flask, render_template, request

@app.route("/", methods = ["GET", "POST"])
def home():
    if request.method == "POST":

        button = request.form['choice1'] #this retrieves which radio button was pressed

        if button == 'A': #if the button with attribute value = "A' is pressed
            #what you want to do when button A is pressed
        elif button == 'B':
            #what you want to do when button B is pressed
        elif button == 'C':
            #what you want to do when button C is pressed
        elif button == 'D':
            #what you want to do when button D is pressed
        elif button == 'E':
            #what you want to do when button E is pressed
    return render_template("home.html")