Django在表单字段中添加占位符文本

6
在Django中,我有以下代码,在HTML页面上创建了一个用户名和密码表单:
```html

在Django中,我有以下代码,在HTML页面上创建了一个用户名和密码表单:

```
<div class="control-group">
    {{ form.username }}
</div>
<div class="control-group">
    {{ form.password }}
</div>

我想在输入框中添加“用户名”和“密码”的占位符文本,当用户单击该字段时,该词消失。如何实现这一点?最佳方法是什么?

2
可能是如何在Django的CharField上添加占位符?的重复问题。 - doru
4个回答

14

您必须使用placeholder属性。

class LoginForm(forms.Form):
    username = forms.CharField(label='username')
    password = forms.CharField(label='password')


    def __init__(self, *args, **kwargs):
        super(LoginForm, self).__init__(*args, **kwargs)
        self.fields['username'].widget.attrs['placeholder'] = 'username'
        self.fields['password '].widget.attrs['placeholder'] = 'password'
或者
class LoginForm(forms.Form):
    username = forms.CharField(label='username',widget=forms.TextInput(attrs={'placeholder':'username'}))
    password = forms.CharField(label='password',widget=forms.PasswordInput(attrs={'placeholder':'password'}))

1
我将这个放在我的forms.py中。那么我在我的views.py中需要什么? - Jaron787
@Jaron787 对于占位符并不需要特殊视图 - aziminia

9

我想使用模型的help_text属性作为占位符。这是根据aziminia的答案,我能想到的最简单的方法:

class MyForm(forms.ModelForm):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        for _, value in self.fields.items():
            value.widget.attrs['placeholder'] = value.help_text

    class Meta:
        model = models.MyModel
        fields = (...)

4

我希望你的项目中有一个forms.py文件。在创建表单时,你可以使用以下代码为字段设置占位符:

username = forms.CharField(label='username', 
                widget=forms.TextInput(attrs={'placeholder': 'username'}))

如果您的项目中有ModelForm,您可以按以下方式实现:

 class MyForm(forms.ModelForm):
    class Meta:
        model = User
        widgets = {
            'username': forms.TextInput(attrs={'placeholder': 'username'}),
             ..........
        }

0

如果您希望将字段名称作为占位符,请使用以下代码:

class LoginForm(forms.ModelForm):
    def __init__(self, *args, **kwargs):
        super(LoginForm, self).__init__(*args, **kwargs)
        for k,v in self.fields.items():
            v.widget.attrs['placeholder'] = k.capitalize()

否则请参考此答案

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接