allauth with crispyform : signup not working - django

Question

I try to enhance my all auth's signup form with Crispy-form but it's not working :)
I modify the allauth form in the forms.py to hide the labels and add the button
My current problem is that the "self.helper.layout = Layout" in the forms.py makes the fields to disappear in the template, but if I comment the self.helper.layout = Layout, I don't have a button to validate my form x(
I would like to have my fields and a working submit button for my form,
Thanks for your help!
details below
forms.py
from django import forms
from allauth.account.forms import SignupForm
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout, ButtonHolder, Submit,Field
from crispy_forms.bootstrap import FormActions
class MySignupForm(SignupForm):
def __init__(self, *args, **kwargs):
super(MySignupForm, self).__init__(*args, **kwargs)
self.helper = FormHelper()
self.helper.form_show_labels = False
self.helper.layout = Layout(
FormActions(
Submit('submit', 'Sign-up', css_class = 'btn-primary')
),
)
I also define in my settings.py that I was using a custom form as signup
# CUSTOM : Allauth Setup part
AUTHENTICATION_BACKENDS = (
# Needed to login by username in Django admin, regardless of `allauth`
'django.contrib.auth.backends.ModelBackend',
# `allauth` specific authentication methods, such as login by e-mail
'allauth.account.auth_backends.AuthenticationBackend',
)
ACCOUNT_EMAIL_REQUIRED = True
ACCOUNT_AUTHENTICATED_LOGIN_REDIRECTS = False
SOCIALACCOUNT_QUERY_EMAIL = ACCOUNT_EMAIL_REQUIRED
#Since users don't have account on the landing page, sign up redirect to thank you page
LOGIN_REDIRECT_URL = '/thank-you'
ACCOUNT_FORMS = {'signup': 'public.forms.MySignupForm'}
I overrided the allauth template with this version
{% extends "base.html" %}
{% load socialaccount %}
{% load crispy_forms_tags %}
{% load i18n %}
{% block head_title %}{% trans "Signup" %}{% endblock %}
{% block content %}
<section id="contact">
<div class="row">
<div class="container">
<div class="col-lg-12 text-center">
<h1 class="section-heading">{% trans "Sign Up" %}</h1>
</div>
<form class="signup" id="signup_form" method="post" action="{% url 'thankyou' %}">
{% crispy form %}
</form>
</div>
</div>
</section>
{% endblock %}

Answer 1

{% crispy form %} already declares by itself <form></form>.
I think this double declaration of <form> confuses the browser.
replace:
<form class="signup" id="signup_form" method="post" action="{% url 'thankyou' %}">
{% crispy form %}
</form>
by:
{% crispy form %}
and insert into forms.py:
class MySignUpForm(SignupForm):
def __init__(self, *args, **kwargs):
super(MySignUpForm, self).__init__(*args, **kwargs)
self.helper = FormHelper()
self.helper.form_id = 'signup_form'
self.helper.form_class = 'signup'
self.helper.form_method = 'post'
self.helper.form_action = reverse('thankyou')
# and then the rest as usual:
self.helper.form_show_labels = False
self.helper.add_input(Submit('signup', 'Sign Up'), css_class='btn btn-primary'))