Django Forms - 更改小部件属性

Question

我想在 django ChoiceField 中为 <option/> 标签定义一个 class 属性，我该怎么做？

我尝试设置小部件 class，并在 forms.py:

中像这样指定一个属性

field = forms.ChoiceField(choices=[(1, 'foo'), (2, 'bar')], widget=forms.Select(attrs={'class': 'form-control'}))

并在我的 template.html 中渲染，如下所示：

{{ form.field }}

输出为：

<select name="field" class="form-control" id="id_field">
   <option value="1">foo</option>
   <option value="2">bar</option>
</select>

而我想要的是：

<select name="field" class="form-control" id="id_fields">
   <option class="form-control" value="1">foo</option>
   <option class="form-control" value="2">bar</option>
</select>

最简单的方法是什么？

Answer 1

您可以创建一个 Template Tag 并编写自定义模板字段。如果你想重用属性，这是最好的选择。

The app should contain a templatetags directory, at the same level as models.py, views.py, etc. If this doesn’t already exist, create it - don’t forget the __init__.py file to ensure the directory is treated as a Python package.

在您的应用程序文件夹中创建此结构

里面 filters.py

from django import template
register = template.Library()

@register.filter(name='addclass')
def addclass(value, arg):
    return value.as_widget(attrs={'class': arg})

在 {% block content %}

之前将 {% load filters %} 添加到您的 template.html

这就是您应用过滤器的方式：

{{form.field|addclass:'form-control'}}

现在您应该忘记将类添加到 forms.py

中的 HTML 元素

如果您不喜欢模板标记方式，或者可能只是在寻找一种低成本的临时解决方案，您应该看看这个 link。

Answer 2

实现此目的的最简单方法是子类化 Select 小部件并将 option_inherits_attrs 设置为 True：

class CustomSelect(forms.Select):
    option_inherits_attrs = True

然后在创建表单时使用您的自定义小部件：

class TestForm(forms.Form):
    items = forms.ChoiceField(
        choices=[(1, 'foo'), (2, 'bar')],
        widget=CustomSelect(
            attrs={'class': 'form-control'}
        )

Django Forms - 更改小部件属性

Django Forms - Change widget attributes

django

django-forms

python-3.x

django-2.1