neca
neca

Reputation: 129

Can't display email field using django allauth

I have problem that in my login.html file the email field won't be displayed. Here is the html code:

<form method="POST" id="signup_form" action="{% url 'account_login' %}" class="registration-form">{% csrf_token %}
    <div class="form-group">
        <!-- <input type="text" name="email" placeholder="Email" class="form-email form-control" id="form-email"> -->
        {{ form.email }}
    </div>

    <div class="form-group">
        <!-- <input type="password" name="password" placeholder="Lozinka" class="form-about-yourself form-control" id="form-about-yourself"></input> -->
        {{ form.password}}
    </div>

    {% if redirect_field_value %}
        <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
    {% endif %}

    <a class="button secondaryAction" href="{% url 'account_reset_password' %}">
        {% trans "Zaboravili ste oznaku?" %}
    </a>
    <br>

    <button type="submit" class="btn">Prijavite se</button>
</form>

So the email field wont be displayed, but the passwod field is. Also the password field is displayed but I cannot customize it. Here is how I'm trying to do that:

class AuthenticationForm(forms.ModelForm):
    """
    Login form
    """
    class Meta:
        model = get_user_model()
        fields = ['email', 'password']


    def __init__(self, *args, **kwargs):
        super(AuthenticationForm, self).__init__(*args, **kwargs)

        self.fields['email'].widget = forms.EmailInput(attrs={
            'placeholder': 'Email adresa*',
            'required': True,
            'class': "form-email form-control"
            })

        self.fields['password'].widget = forms.PasswordInput(attrs={
            'placeholder': 'Lozinka*',
            'required': True,
            'class': "form-first-name form-control"
            })

I am having all of this for my signup page and it works fine. I tried with form.as_p and it works fine, but I want my own style. Thank you for your time.

Upvotes: 2

Views: 731

Answers (2)

P3P5
P3P5

Reputation: 1003

Use {{ form.login }} to display the email field, instead of {{ form.email }}


From https://github.com/pennersr/django-allauth/blob/master/allauth/account/forms.py you can see that Django login form has three fields, login, password and remember. So in you case just do

<form method="POST" id="signup_form" action="{% url 'account_login' %}" class="registration-form">{% csrf_token %}
    <div class="form-group">
        <!-- <input type="text" name="email" placeholder="Email" class="form-email form-control" id="form-email"> -->
        {{ form.login}}
    </div>

    <div class="form-group">
        <!-- <input type="password" name="password" placeholder="Lozinka" class="form-about-yourself form-control" id="form-about-yourself"></input> -->
        {{ form.password}}
    </div>

    {% if redirect_field_value %}
        <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
    {% endif %}

    <a class="button secondaryAction" href="{% url 'account_reset_password' %}">
        {% trans "Zaboravili ste oznaku?" %}
    </a>
    <br>

    <button type="submit" class="btn">Prijavite se</button>
</form>

Upvotes: 3

Kres
Kres

Reputation: 154

I'm not a django expert, but if you only want to style your inputs, it might be better to use django-widget-tweaks. It keeps styling and python code seperated.

So first you can install it with:

pip install django-widget-tweaks

Then add 'widget_tweaks' to INSTALLED_APPS.

Load widget_tweaks in your template:

{% load widget_tweaks %}

And in your case you would put something like:

{% render_field form.email placeholder='Email adresa*' required="required" class="form-email form-control" %}

{% render_field form.password placeholder='Lozinka*' required="required" class="form-first-name form-control" type="password" %}

in your template instead of:

{{ form.email }}
{{ form.password }}

If you choose to do this, I think you don't need __init__() method in your AuthenticationForm

EDIT1: In my case I also had to add type="password" to the password render_field tag

Upvotes: 0

Related Questions