首页 > 解决方案 > 在小部件级别检查错误和其他值 - 可能使用自定义表单字段

问题描述

如果一个字段在小部件级别有错误,我该如何访问?

使用默认我试过:

{% if widget.attributes.has_errors %} or {% if widget.has_errors %}

但不工作。

我使用自定义小部件模板,我正在考虑使用自定义表单字段并覆盖默认字段。

我知道clean方法存在,但我不知道如何将我想要的动态(非默认)数据/属性推送到小部件。

我试过了:

class AWidget(forms.Widget):

    def get_context(self, name, value, attrs):

        context = super().get_context(name, value, attrs)
        has_errors = context['widget']['attrs'].pop('has_errors', None)
         context['widget']['has_errors'] = has_errors

它适用,errors但我不知道是否是最好的选择,而且我想从表单字段传递其他值/属性,我认为尝试覆盖表单字段会更好,但我不知道具体如何。

还使用以下方法访问单个属性:

 {{ widget.attrs.maxlength }} or  {{ widget.attrs.items.maxlength }}

即使 for 循环中的加入有效


我知道我可以添加一个带有一类错误的父 div:

 <div class="{% if form.field.errors %}pass_error{% endif %}">
        {{ form.field }} 
    </div>

但是,这意味着 css 级别的重大变化。

我已经用自定义小部件覆盖了所有 Django 小部件,出错时我不仅需要更改边框颜色,还需要显示或不显示小部件模板的不同元素以及其中一些元素的位置发生变化。

我已经修改了基于小部件以添加错误,但我希望通过从字段传递到小部件来以更优雅的方式在字段级别执行此操作,参数取决于错误类型。

所以我的问题是我需要覆盖什么才能从字段传递到小部件错误和其他变量?

标签: djangodjango-formsdjango-widget

解决方案


小部件是您如何将字段的数据/值渲染到 HTML 渲染模板中的方式,这是小部件的唯一功能,请看以下从文档中获取的示例:

>>> name = forms.TextInput(attrs={'required': True})
>>> name.render('name', 'A name')
'<input name="name" type="text" value="A name" required>'
>>>
>>> name = forms.TextInput(attrs={'required': False})
>>> name.render('name', 'A name')
'<input name="name" type="text" value="A name">'

因此,小部件不知道数据是否有效(有错误),应该保持这种状态。

在小部件级别处理任何数据错误/验证不是一个好主意,我可以确保,如果您更改字段的外观(小部件),您的验证将继续工作。

说...

如何访问字段错误?

当您呈现表单时,您可以逐个字段地进行,让我们以这个表单为例:

class LoginForm(forms.Form):
    username = forms.CharField(max_length=255)
    password = forms.CharField(widget=forms.PasswordInput)

你可以写模板:

<form action="." method="get">
   <p>{{ loginform.username.label }}: {{ loginform.username }}</p>
   <p>{{ loginform.password.label }}: {{ loginform.password}}</p>
    <button type="submit">submit</button>
</form>

这将呈现如下内容:

在此处输入图像描述

现在,假设您的表单不允许输入少于 8 个字符的密码:

class LoginForm(forms.Form):
    username = forms.CharField(max_length=255)
    password = forms.CharField(widget=forms.PasswordInput)

    def clean_password(self):
        password = self.cleaned_data['password']
        if len(password) < 8:
            raise forms.ValidationError(
            "Password must have at least 8 characters, it has only %(password_length)s",
            code='invalid password',
            params={'password_length': len(password)}
        )
        return password

您可以像这样访问密码错误:

<form action="." method="get">
    {% csrf_token %}
    <p>{{ form.username.label }}: {{ form.username }}</p>
    <p>{{ form.password.label }}: {{ form.password}}</p>

    <ul>
        {% for error in form.password.errors %}
            <li>{{ error }}</li>    
        {% endfor %}
    </ul>

   <button type="submit">submit</button>
</form>

现在如果你输入一个短密码......

在此处输入图像描述

如果有错误,我希望控件看起来不同。

{% if ... %}如果模板代码中出现错误,您可以添加一些样式:

 <p>
    {{ form.password.label }}:
    <span class="{% if form.password.errors %}pass_error{% endif %}">
        {{ form.password }} 
    </span>
 </p>

使用 CSS:

 <style>
    .pass_error input {
        border-color: red;
    }
 </style>

这是结果:

在此处输入图像描述

结论。

验证和处理表单中的数据错误或使用验证器,使用小部件显示数据,当然,您可以自定义数据的呈现方式,因为您可以为小部件指定自定义模板。

如果你想在模板代码中为你的小部件添加属性,我也推荐django-widget-twaeks 。这个应用程序允许您编写类似的代码(来自应用程序文档的示例):

{% load widget_tweaks %}

<!-- change input type (e.g. to HTML5) -->
{% render_field form.search_query type="search" %}

<!-- add/change several attributes -->
{% render_field form.text rows="20" cols="20" title="Hello, world!" %}

<!-- append to an attribute -->
{% render_field form.title class+="css_class_1 css_class_2" %}

<!-- template variables can be used as attribute values -->
{% render_field form.text placeholder=form.text.label %}

推荐阅读