如何垂直或水平堆叠两个多复选框字段wtform字段

Question

我有一个使用小部件的表单。我想要的是两个垂直列并排的复选框。在

class MultiCheckboxField(SelectMultipleField):
    widget = widgets.ListWidget(prefix_label=False)
    option_widget = widgets.CheckboxInput()

class SimpleForm2(Form):
    menu_items = MultiCheckboxField('Menu Item', choices=[], coerce=int)
    contents = MultiCheckboxField('Content', choices=[], coerce=int)
    submit = SubmitField('OK')

例如

• 菜单项|内容
• cbox1 | cbox1'

Answer 1

这是水平堆叠

这个答案做了所有的工作 css stacking

from flask_wtf import Form

class SimpleForm2(Form):
    menu_items = MultiCheckboxField('Menu Item', choices=[], coerce=int)
    # contents = MultiCheckboxField('Content', choices=[], coerce=int)
    # submit = SubmitField('OK')


class SimpleForm3(Form):
    # menu_items = MultiCheckboxField('Menu Item', choices=[], coerce=int)
    contents = MultiCheckboxField('Content', choices=[], coerce=int)
    # submit = SubmitField('OK')

@manage.route('/test', methods=['GET', 'POST', 'PUT', 'DELETE'])
@login_required
def test(menu_item_id=None):
    form = SimpleForm2()
    form1 = SimpleForm3()
    form1.contents.choices = [(x.id, x.name) for x in MenuItemContent.query.filter_by(store_id=current_user.id).all()]
    form.menu_items.choices = [(x.id, x.product_name) for x in MenuItem.query.filter_by(store_id=current_user.id).all()]
    info = []
    if form.validate_on_submit() and form1.validate_on_submit():
        menu_item = form.data['menu_items']
        contents = form1.data['contents']
        for mid in menu_item:
            info = []
            for c in contents:
                info.append({"menu_content_id": c,
                             "default": 0,
                             "cost": 0})
            MenuManager(db.session).create_menu_with_content_relationship(store_id=current_user.id,
                                                                          menu_id=mid,
                                                                          menu_content_info=info)

    return render_template('manage/form_test.html', form=form, form1=form1)

形式_测试.html

^{pr2}$