crispy-forms:为其中一个输入添加css类

Question

在我的forms.py我

[...]
self.helper.layout = Layout(
    Field('name'),
    Field('description'),
)
self.helper.form_class = 'form-horizontal'
self.helper.label_class = 'col-md-2 col-xs-3'
self.helper.field_class = 'col-md-10 col-xs-9'
[...]

它呈现给

<div id="div_id_name" class="form-group">
    <label class="control-label col-md-2 col-xs-3 requiredField" for="id_name">
        Name
    </label
    <div class="controls col-md-10 col-xs-9">
        <input id="id_name" class="textinput textInput form-control" type="text" name="name" maxlength="20">
    </div>
</div>
<div id="div_id_description" class="form-group">
    <label class="control-label col-md-2 col-xs-3 requiredField" for="id_description">
        Description
    </label>
    <div class="controls col-md-10 col-xs-9">
        <textarea id="id_description" class="textarea form-control" rows="10" name="description" cols="40"></textarea>
    </div>
</div>

现在我想只是名称输入要小一些,就像这样:

[...]
<div class="controls col-md-8 col-xs-7">
        <input id="id_name" class="textinput textInput form-control" type="text" name="name" maxlength="20">
    </div>
</div>
[...]

(如何)以脆皮形式实现？

Answer 1

给你帮手布局:

self.helper.layout = Layout(
    Field('name'),
    Field('description'),

添加css_class:

Field('field_name', css_class="controls col-md-8 col-xs-7")

这是文档链接

Answer 2

我看到两种可能性：

1.使用CSS

#div_id_name {
    font-weight: 0.8em;
}

2. 覆盖字段模板

您可以覆盖字段的字段模板：

Field('field_name', template='my_field_template.html')

有关参考字段模板，请参阅site-packages/crispy_forms/templates/bootstrap3/field.html。

(3.等待)

Github 上有一个未解决的问题：https ://github.com/maraujop/django-crispy-forms/issues/348

Answer 3

实现此功能的唯一方法是不使用某些 form.helpers。

我的配置是

    # from
    self.helper.form_class = 'form-horizontal'
    self.helper.label_class = "col-md-2"
    self.helper.field_class = "col-md-10"
    # -> to
    self.helper.form_class = 'form-vertical'
    #self.helper.label_class = "col-md-2"
    #self.helper.field_class = "col-md-10"
    Fieldset('Address',
                 Div(
                     #I need to set size for every field wrapped in a div
                     Div('tipo_logradouro', css_class="col-md-6"), 
                     Div('logradouro', css_class='col-md-6'),
                     css_class='row'
                 ),
     )

我知道这个旧的但我希望它对某人有帮助。