将 css 类应用于 forms.RadioSelect 小部件答案

【问题标题】：Apply css class to forms.RadioSelect widget将 css 类应用于 forms.RadioSelect 小部件
【发布时间】：2012-12-19 00:50:51
【问题描述】：

我正在使用 ModelForm 并尝试在 Django forms.RadioSelect 小部件上设置一个 css 类，例如

class Meta:
    model = models.MyModel
    fields = ('rating',)
    widgets = {
      'rating': forms.RadioSelect(attrs={'class':'star'}),
    }

但 class='star' 不会在 html 中呈现。

我也尝试过使用：

def __init__(self, *args, **kwargs):
    super(MyModelForm, self).__init__(*args, **kwargs)
    self.fields['rating'].widget.attrs['class'] = 'star'

这也不起作用。我用 forms.Textarea 小部件尝试了同样的事情，在那里我能够渲染 css 类。

我在这里做错了什么还是 RadioSelect 只是不支持类属性（我希望将类名应用于所有无线电输入）？

【问题讨论】：

标签： django django-forms django-widget

【解决方案1】：

复选框和单选小部件不像其他小部件那样继承自 Input。

class 属性确实适用于RadioSelect，但它单独应用于每个无线电输入。

例如考虑以下形式：

from django import forms
class MyForm(forms.Form):
    my_field = forms.ChoiceField(widget=forms.RadioSelect(attrs={'class': 'star'}), choices=(('x', 'x'), ('y', 'y'),))

它会在模板中输出以下html：

<tr><th><label for="id_my_field_0">My field:</label></th>
  <td>
    <ul>
      <li><label for="id_my_field_0"><input value="x" type="radio" class="star" name="my_field" id="id_my_field_0" /> x</label></li>
      <li><label for="id_my_field_1"><input value="y" type="radio" class="star" name="my_field" id="id_my_field_1" /> y</label></li>
    </ul>
  </td>
</tr>

请注意，该类应用于每个 input 元素。

【讨论】：

好的，谢谢您的回答。最后，我发现一旦我删除了对 django-crispy-forms 的依赖，RadioSelect 的行为就像你解释的那样。我应该提到我首先使用的是 django-crispy-forms。

【解决方案2】：

你可以使用这个库：https://pypi.python.org/pypi/django-widget-tweaks

它允许您执行以下操作：

{% load widget_tweaks %}
<!-- add 2 extra css classes to field element -->
{{ form.title|add_class:"css_class_1 css_class_2" }}

【讨论】：