How to add placeholder UserCreationForm django? - django

Question

I'm trying to add a placeholder to the username field in the UserCreationForm
but i can't understand how to do it.
I have already change the forms.py file in this way /lib/site-packages/django/contrib/auth/forms.py.
I add a placeholder to password1 and password2 fields and work like this:
class UserCreationForm(forms.ModelForm):
"""
A form that creates a user, with no privileges, from the given username and
password.
"""
error_messages = {
'password_mismatch': _("The two password fields didn't match."),
}
password1 = forms.CharField(
label=_("Password"),
strip=False,
widget=forms.PasswordInput(attrs={'placeholder':'Password'}),
help_text=password_validation.password_validators_help_text_html(),
)
password2 = forms.CharField(
label=_("Password confirmation"),
widget=forms.PasswordInput(attrs={'placeholder':'Confirmar Password'}),
strip=False,
help_text=_("Enter the same password as before, for verification."),
)
I can see probably the username field is coming from class meta:
class Meta:
model = User
fields = ("username",)
field_classes = {'username': UsernameField}
from this class but i'm not sure about that
class UsernameField(forms.CharField):
def to_python(self, value):
return unicodedata.normalize('NFKC', super().to_python(value))
I don't understand how add a placeholder to username field
this is my html
<form method="post" action=".">
{% csrf_token %}
{% for field in form %}
{{ field }}<br />
{% for error in field.errors %}
<p style="color: red">{{ error }}</p>
{% endfor %}
{% endfor %}
<input id="submit-signup-btn" type="submit" value="Iniciar"/>
</form>

Answer 1

After a while looking at this, i found a way to do it, this is the way i did it:
in the file /lib/site-packages/django/contrib/auth/forms.py, in class UserCreationForm, under class Meta there is a init function where you can see this line
self.fields[self._meta.model.USERNAME_FIELD].widget.attrs.update({'autofocus':
True})
i added the placeholder to the end of the line in the update method like this:
self.fields[self._meta.model.USERNAME_FIELD].widget.attrs.update({'autofocus': True,
'placeholder':'Nome Perfil'})

Answer 2

Based on #Gabriel costa answer, I came up with this solution:
class AccountCreationForm(UserCreationForm):
def __init__(self, *args, **kwargs):
super().__init__(*args, **kwargs)
self.fields['username'].widget.attrs.update({'placeholder':_('Username')})
self.fields['email'].widget.attrs.update({'placeholder':_('Email')})
self.fields['password1'].widget.attrs.update({'placeholder':_('Password')})
self.fields['password2'].widget.attrs.update({'placeholder':_('Repeat password')})
Other solutions don't work in this scenario.

Answer 3

I had a similiar problem before, this is how i solved it :
class Meta:
......
widgets = {
'username': forms.fields.TextInput(attrs={'placeholder': 'random stuff'})
}
or internally , e.g
city = forms.CharField(widget=forms.TextInput(attrs={'placeholder':'text'}))

Answer 4

You can also define widgets in form's Meta class.
class Meta:
model = User
fields = ("username",)
field_classes = {'username': UsernameField}
widgets = {
'username': form.fields.TextInput(attrs={'placeholder': 'Your text for placeholder'})
}