Переопределение представлений django-allauth для использования с модалами

Я пытаюсь обработать функциональность входа/регистрации в модальном представлении. Я добился успешного входа/регистрации, импортировав LoginForm и RegistrationForm в модальное представление, а затем отправив их на соответствующие allauth URL. Желаемое поведение заключается в том, чтобы формы с ошибками отображались в модальном представлении асинхронно.

Мне не удалось добиться того, чтобы формы с ошибками (email не существует при попытке входа, пароли не совпадают при регистрации и т.д.) отображались как html-частица в модале с ошибками. Я не слишком уверен, с чего начать, пытаясь добавить эту функциональность в мое собственное представление/как использовать представления allauth и изменить их функциональность

Добавив нижеприведенное к моим views.py и url.py, мне удалось заставить шаблон allauth по умолчанию загружаться, когда форма недействительна (например, поле email не содержит действительный email), но не удалось заставить мой шаблон загружаться.

Из файла views.py:

class LoginViewSnippet(LoginView):
    success_url = reverse_lazy('home')
    template_name = 'user_app/partials/loginmodal.html'

    def get_context_data(self, **kwargs):
        print('here1')
        context = super(LoginView,self).get_context_data(**kwargs)
        return context

    def form_invalid(self, form):
        print('here')
        error_msg = 'error'
        return HttpResponse(error_msg, status=400)

login = LoginViewSnippet.as_view()

From urls.py:

path('accounts/login',user_app_views.login, name='account_login'),

From user_app/partials/loginmodal.html:

...

<div class="modal-body">
    <form id="loginform" method="POST" action="{% url 'account_login' %}" autocomplete="off">
        {% csrf_token %}
        {% for field in loginform %}
        <div class="form-group mb-3">
            {{ field.errors }}
            {{ field | as_crispy_field }}
        </div>
        {% endfor %}
    </form>
</div>
<div class="mx-auto">
    <button form="loginform"type="submit" class="btn btn-success" hx-post="{% url 'account_login' %}" hx-target="#modals-here">Login</button>
    <button type="button" class="btn btn-secondary" onclick="closeModal()">Close</button>
</div>
...

Вернуться на верх