在 django 中将 css 类添加到验证错误的字段

Posted 2023-02-24

【中文标题】在 django 中将 css 类添加到验证错误的字段

【英文标题】：Adding css class to field on validation error in django

【发布时间】：2011-06-18 09:19:24

【问题描述】：

我正在使用 Django 的模型形式，它非常好。如果存在与之相关的验证错误，我如何突出显示实际的文本框（例如边框：红色）。基本上我想要的是在字段出现验证错误时添加一个类（错误）。

【问题讨论】：

如何在模板中生成表单 html？一次打印整个表单对象还是逐个字段打印？

我正在循环遍历表单元素并分别打印错误、字段和标签。

【参考方案1】：

定义error_css_class怎么样？ http://docs.djangoproject.com/en/dev/ref/forms/api/#styling-required-or-erroneous-form-rows?

class MyForm(ModelForm):
    error_css_class = 'error'

【讨论】：

这为表单字段的容器提供了类。如果我想为表单字段本身分配类怎么办？

在这种情况下使用自定义表单模板

@Myth: $('.error').find(':input').css('background-color', 'pink');

【参考方案2】：

扩展 errx 的答案。

添加 CSS

.error input, .error select 
    border: 2px red solid;

专门突出显示该字段

【参考方案3】：

试试这个？

self.fields['field_you_want_to_add_error'].widget.attrs['class'] = "error"

【参考方案4】：

回答原来的问题。

您可以将所需的类添加到视图中您提交表单并执行form.is_valid() 检查的字段中。不是最漂亮的，但它会起作用。

def submit_form(request):
    if request.method = 'POST':
        if. form.is_valid():
            # Do something with clean form data
            pass
        else:
            # Append css class to every field that contains errors.
            for field in form.errors:
                form[field].field.widget.attrs['class'] += ' my-css-class'
    return render(request, submit_form.html, 
        'form': form
    )

【参考方案5】：

模板：

<div style="color:red"> userForm.short_description.errors.as_text  </div>