使用 django 脆皮表单自定义非表单错误

Posted 2023-02-24

【中文标题】使用 django 脆皮表单自定义非表单错误

【英文标题】：Customize non form errors with django crispy form

【发布时间】：2017-03-19 12:16:29

【问题描述】：

我想自定义 django crispy 显示非表单错误的方式。我知道如何更改文本，但我不知道在哪里更改 css。

这是图片： My login area

forms.py

class LoginForm(forms.Form):
    alphanumeric = RegexValidator(r'^[0-9a-zA-Z]*$', 'Only alphanumeric characters are allowed.')
    username = forms.CharField(label='', required=True, widget=forms.TextInput(attrs='placeholder': 'Username'))
    password = forms.CharField(label='', required=True, widget=forms.PasswordInput(attrs='placeholder': 'Password'))
    name = forms.CharField(label='', 
                        required=True ,  
                        validators=[alphanumeric], 
                        widget=forms.TextInput(attrs='placeholder': 'Name'))


    def clean(self):
        username = self.cleaned_data.get('username')
        password = self.cleaned_data.get('password')
        user = authenticate(username=username, password=password)
        if not user or not user.is_active:
            raise forms.ValidationError('Invalid Login : I want to change this CSS')
        return self.cleaned_data

    def login(self, request):
        username = self.cleaned_data.get('username')
        password = self.cleaned_data.get('password')
        user = authenticate(username=username, password=password)
        return user

模板 - html

<form method="POST" action="">% csrf_token %
    <!--% if  form.non_field_errors %
        testing
    % endif %-->
    form|crispy
    <div class="form-info">
        <label class="hvr-sweep-to-right">
            <input class="create btn"  type="submit" value="Submit">
        </label>
    </div>
</form>

【参考方案1】：

我假设您使用带有引导程序的酥脆表单（取决于图像中的样式）。

所以你可以覆盖原来的引导类

.alert 
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;


.alert-danger 
  background-color: #f2dede;
  border-color: #ebcccc;
  color: #a94442;


.alert-danger hr 
  border-top-color: #e4b9b9;


.alert-danger .alert-link 
  color: #843534;

或其他警报类，例如警报成功。

如果您不想为整个项目覆盖这些类，只需在您的脆表单周围设置一个 div

<div class"crispyform">
  form|crispy
</div>

并写入您的自定义 css s.th。喜欢

.crispyform .alert 
  # your new style

【讨论】：

谢谢兄弟！我一直在研究后端，现在是时候去研究前端了。我试图将错误作为 django.message 发送，然后我会对其进行自定义。但是你的方法是最简单的！