【问题标题】:Can't add css class to some form fieds无法将 css 类添加到某些表单字段
【发布时间】:2016-10-04 12:59:50
【问题描述】:

也许这只是一个错误或众所周知的功能,但在谷歌上没有找到任何东西。
来自表单的片段(用于 django 注册的注册表单):

widgets = {
        'username': HiddenInput(),
        'email': EmailInput(attrs={'class': "form-control"}),
        'password1': PasswordInput(attrs={'class': "form-control"}),
        'password2': PasswordInput(attrs={'class': "form-control"}),
        'first_name': TextInput(attrs={'class': "form-control"}),
        'last_name': TextInput(attrs={'class': "form-control"}),
    }

来自模板的片段:

<div class="container">
{{ form.non_field_errors }}
<form method="post">
    {% csrf_token %}
    {% for field in form %}
    {% if field.name != 'username' %}
    <div class="form-group row {% if field.errors %}has-danger{% endif %}">
        {% if field.errors %}
        <div class="form-control-feedback">{{ field.errors.as_text }}</div>
        {% endif %}
        <label for="{{ field.id_for_label }}" class="col-form-label col-xs-2">{{ field.label }}</label>
        <div class="col-sm-10">
            {{ field }}
        </div>
    </div>
    {% endif %}
    {% endfor %}
    <div class="form-group row">
        <div class="offset-sm-2 col-sm-10">
        <button type="submit" class="btn btn-primary">Register</button>
        </div>
    </div>
</form>

根本没有火箭科学。密码和电子邮件没有 css 类,而是文本字段!我错过了什么吗?

【问题讨论】:

    标签: django django-registration


    【解决方案1】:

    您缺少定义小部件时的信息。请参阅此处提供的答案:

    CSS styling in Django forms

    【讨论】:

    • IMO 我做了与链接答案相同的事情。你能具体说明我缺少哪些细节吗?
    • 将表单添加到您的输入有帮助吗?示例:'last_name': forms.TextInput(attrs={'class': "form-control"}),
    • 1.sn-p 适用于 first_name 和 last_name 字段,但不适用于电子邮件或密码。所以它不是进口问题。也请阅读我自己的答案
    【解决方案2】:

    经过进一步测试,这似乎是 django-registration 的一个错误。并非所有字段都通过小部件规范获取属性。作为解决方法,我通过模板标签添加了 css 类。

    我不知道它是否正确,所以我不会将此标记为已接受的答案。但这对我有帮助。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-12-21
      • 2023-03-26
      • 2011-07-14
      • 2015-06-25
      • 2015-04-24
      • 1970-01-01
      • 1970-01-01
      • 2021-03-05
      相关资源
      最近更新 更多