CODEWITHSUNDEEP
django-allauthdjango-crispy-forms
fbzyx
fbzyx

Reputation: 349

Hide form labels using django-allauth and crispy form

I use django-allauth and crispy forms to customize my login form. Everything works fine without any problems. The only issue is that I am not able to hide the form labels.

I dont want to use javascript to hide the label fields. Would be nice to be able to do this from python.

enter image description here

Thank you in advance.

forms.py (override of allauth login form)

from crispy_forms.helper import FormHelper
from allauth.account.forms import LoginForm
from django.contrib.auth.forms import AuthenticationForm
from django import forms


class UserLoginForm(LoginForm):

    def __init__(self, *args, **kwargs):
        super(UserLoginForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper(self)
        self.helper.form_show_labels = False

settings.py

...
ACCOUNT_FORMS = {'login': 'user.forms.UserLoginForm'}
...

lohin.html

{% extends "account/base.html" %}

{% load crispy_forms_tags %}


{% block content %}

<form class="login" method="POST" action="{% url 'account_login' %}">
  {% csrf_token %}

  {{ form|crispy }}

  <a class="..." href="">...</a>
  <button class="..." type="submit">{...</button>
</form>

{% endblock %}

UPDATE

I ended doing it like this:

class UserLoginForm(LoginForm):

    def __init__(self, *args, **kwargs):
        super(UserLoginForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper(self)
        self.helper.form_show_labels = False

        self.fields["login"].label = ""
        self.fields["password"].label = ""

But why self.helper.form_show_labels = False doesn't work?

Upvotes: 1

Views: 634

Answers (1)

user14685122
user14685122

Reputation:

Yeah i have faced the same problem, i don't know why FormHelper() class from crispy forms don't works.But i found a solution, its a simple solution from css.If you see the inspector in browser for crispy forms, crispy forms use .requiredField class to display the label.so, you want to override the class using css.

.requiredField{
  display: none;
}

Please note that in future crispy forms may change the class, so in every update of crispy form check the class in browser inspector.

Upvotes: 1

Related Questions