如何使用 WTForms 单独呈现单选按钮？

Question

我想要一个带有一组单选按钮的表单，每个单选按钮控制几个其他控件的启用，我希望其他控件与单选按钮穿插在一起。简而言之，我想要这样的东西：

单选按钮
- 复选框
单选按钮
- Select 列表
单选按钮

每个单选按钮启用其下方的控件。

问题是 Jinja2 想要将单选按钮呈现为一组，它们之间没有任何东西；似乎没有一种干净的方式来引用各个按钮元素。

如何在 Jinja2 代码中呈现各个单选按钮？我正在使用 WTForms 2.3.3 和 Flask 2.0.1。

作为参考，这里是 FlaskForm：

def list_sellers():
    c1 = aliased(Contact)
    c2 = aliased(Contact)
    return db.session.query(c2).
        select_from(c1).join(c2, c2.id==c1.seller_id).
        filter(c1.seller_id != None)
    
class ExportForm(FlaskForm):
    filtered = BooleanField('Apply Filters')
    sellers_filter = RadioField(
        'Filter by Seller',
        choices=[
            ('all', 'All Sellers'),
            ('select', 'Select Seller'),
            ('none', 'No Seller')
        ],
        validators=[Optional()]
    )
    seller = QuerySelectField(
        'Seller',
        query_factory=list_sellers,
        allow_blank=False,
        validators=[Optional()],
        render_kw={'class': 'form-select'},
    )
    submit = SubmitField('Download')

Answer 1

根据我对你的问题的理解，它在某种程度上是重复的here

您需要为您的目的编写 javascript 代码。

Answer 2

我得到了一些东西，但恕我直言，它真的很难看：

{% for subfield in form.sellers_filter %}
  {% if subfield.id.endswith('0') %}
    <div class="form-group col-4">
      {{ subfield.label }} {{ subfield }}
    </div>
  {% endif %}
  {% if subfield.id.endswith('1') %}
    <div class="form-group col-4">
      {{ subfield.label }} {{ subfield }}
      {{ form.seller }}
    </div>
  {% endif %}
  {% if subfield.id.endswith('2') %}
    <div class="form.group col-4">
      {{ subfield.label }} {{ subfield }}
    </div>
  {% endif %}
{% endfor %}

Answer 3

您也可以在一行中完成，这样代码会更短一些，而无需额外的“if”语句

{% for subfield in form.sellers_filter if subfield.id.endswith('0')%}
{{ subfield.label }} {{ subfield }}
{% endfor %}

如何使用 WTForms 单独呈现单选按钮？

How Do I Render Radio Buttons Individually With WTForms?

jinja2

flask

wtforms

flask-wtforms