WTForm:带SelectField的FieldList,我该如何渲染?

我有这个订单,允许我的用户创建订单。 一个订单由(producetype, quantity)的多个元组组成。 Producetype应该以<select>形式呈现,而数量只能是输入。 农产品类型的选择应该动态添加,因为这可能会改变。 目前,我已经写在这个纯粹的HTML

在这里输入图像描述

我想为此使用WTForm,因为WTForm确实简化了我的代码。 但是,我无法这样做:

码:

class OrderEntryForm(Form):
  quantity = IntegerField('Quantity',
                          [validators.Required(), validators.NumberRange(min=1)])
  # we will be dynamically adding choices
  producetype = SelectField('Produce',
                            [validators.Required()],
                            choices=[])

class OrderForm(Form):
  name = TextField('Crop', [validators.Length(min=3, max=60)])
  due_date = DateField('Due Date', [validators.required()])
  order_entries = FieldList(FormField(OrderEntryForm))

我有以下问题:

  • 我如何动态添加选项到order_entries字段?
  • 如果我有订单, order = { name:hello, due_date:2014-06-18, order_entries:[ {producetype_id: 1, quantity: 2}, {producetype_id: 3, quantity: 4}] } ,如何填充我的有正确的OrderEntryForm值的OrderForm
  • 我的代码可以在这里找到:https://gist.github.com/vicngtor/f8c8f0519dbd6b3b6110


    如何动态添加选项到OrderForm的order_entries字段

    这取决于你的意思

    如果你的意思是你想在渲染后在表单中添加行项目。 您必须使用DOM操作在客户端添加这些操作。 WTForms有一个命名约定用于处理表单字段上的索引。 它的name="<form-field)name>-<index>" 。 如果您使用遵循此惯例的JavaScript添加名称,则WTForms将知道如何在后端处理它。

    如果你的意思是你想要一个动态的选择列表,那么你可以在实例化后迭代表单中的FieldList 。 你可以分配choices任何2元组的迭代。 在下面的例子中,我直接分配它们,但它们可以很容易地从存储中检索。

    order_form = OrderForm()
    for sub_form in order_form.order_entries:
        sub_form.producetype.choices = [('2', 'apples'), ('2', 'oranges')]
    

    如何使用正确的OrderEntryForm值填充我的OrderForm?

    您只需使用obj关键字参数将对象直接绑定到表单即可。 WTForms足够聪明,可以根据对象的属性动态构建表单。

    from wtforms import Form, IntegerField, SelectField, TextField, FieldList, FormField
    from wtforms import validators
    from collections import namedtuple
    
    OrderEntry = namedtuple('OrderEntry', ['quantity', 'producetype'])
    Order = namedtuple('Order', ['name', 'order_entries'])
    
    class OrderEntryForm(Form):
      quantity = IntegerField('Quantity',
                              [validators.Required(), validators.NumberRange(min=1)])
      # we will be dynamically adding choices
      producetype = SelectField('Produce',
                                [validators.Required()],
                                choices=[
                                    (1, 'carrots'),
                                    (2, 'turnips'),
                                ])
    
    class OrderForm(Form):
      name = TextField('Crop', [validators.Length(min=3, max=60)])
      order_entries = FieldList(FormField(OrderEntryForm))
    
    # Test Print of just the OrderEntryForm
    o_form = OrderEntryForm()
    print o_form.producetype()
    
    # Create a test order
    order_entry_1 = OrderEntry(4, 1)
    order_entry_2 = OrderEntry(2, 2)
    
    order = Order('My First Order', [order_entry_1, order_entry_2])
    
    order_form = OrderForm(obj=order)
    
    print order_form.name
    print order_form.order_entries
    

    以上示例创建一个示例Order并将其提供给obj关键字。 在渲染时,这将产生以下(无风格):

    在这里输入图像描述


    添加一个SubmitField到你的OrderForm

    submit_something = SubmitField((u'Add something'))
    

    然后从您的视图调用它,并使用append_entry的方法FieldList

    if form.submit_something.data:
             form.order_entries.append_entry()
             return render_template('yourtemplate.html', form=form)
    

    希望有所帮助!

    链接地址: http://www.djcxy.com/p/21171.html

    上一篇: WTForm: FieldList with SelectField, how do I render?

    下一篇: Android Fragment Animation is repeated again on Orientation Change