Как мне обновить свой код, чтобы вход и регистрация были на одной странице в django?

Я хочу, чтобы форма входа и регистрации находилась на одной странице, я также хочу зарегистрироваться и войти в систему в зависимости от того, какая кнопка была нажата. Вот моя страница регистрации введите сюда описание изображениявведите сюда описание изображения

и вот мои представления.py

def register_view(request):

    if request.method == "POST":
        form = UserRegisterForm(request.POST or None)
        if form.is_valid():
            new_user = form.save()
            username = form.cleaned_data.get("username")
            messages.success(request, f"Hey {username}, Your account was created successfuly")
            new_user = authenticate(username=form.cleaned_data['email'], 
                                    password = form.cleaned_data['password1'])
            login(request, new_user)
            return redirect("core:index")
    else:
        print("User cannot be registered")
        form = UserRegisterForm()

    context = {
        'form': form,
    }
    return render(request, "userauths/sign-up.html", context)

def login_view(request):
    if request.user.is_authenticated:
        return redirect("core:index")
    if request.method == "POST":
        email = request.POST.get("email")
        password = request.POST.get("password")
        
        try:
            user = User.object.get(email=email)
        except:
            messages.warning(request, f"User with {email} does not exist")
            
        user = authenticate(request, email=email, password=password)
        
        if user is not None:
            login(request, user)
            messages.succes(request, "You are logged in")
            return redirect("core:index")
        else:
            messages.warning(request, "User does not exist. Create an account!!")
    
    context = {
        
    }
    return render(request, "userauths/sign-in.html", context)

регистр.html

<div class = "login-form">
              <form class = "sign-in-htm" method = "POST">
                {% csrf_token%}
                <div class = "group">
                  <label for = "user" class = "label">Email</label>
                  <input id = "user" type = "text" class = "input" required name = "email">
                </div>
                <div class = "group">
                  <label for = "pass" class = "label">Password</label>
                  <input id = "pass" type = "password" class = "input" name = "password" required data-type = "password">
                </div>
                <div class = "group">
                  <input id = "check" type = "checkbox" class = "check" checked>
                  <label for = "check"><span class = "icon"></span> Keep me Signed in</label>
                </div>
                <div class = "group">
                  <input type = "submit" class = "button" value = "sign-in">
                </div>
                <div class = "hr"></div>
                <div class = "foot-lnk">
                  <a href = "#forgot">Forgot Password?</a>
                </div>
              </form>
              <form class = "sign-up-htm" method = "POST">
                {% csrf_token %}
                <div class = "group">
                    {{form.username}}
                  </div>
                  <div class = "group">
                    {{form.password1}}
                  </div>
                  <div class = "group">
                      {{form.password2}}
                    </div>
                  <div class = "group">
                    {{form.email}}
                  </div>
 
                <div class = "group">
                  <input type = "submit" class = "button" value = "sign-up">
                </div>
                <div class = "hr"></div>
                <div class = "foot-lnk">
                  <label for = "tab-1">Already Member?</a>
                </div>
              </form>
            </div>

Я пытался создать оператор if, но он просто разрывает страницу. Я знаю, что это возможно, но идеи, которые я пробовал, не сработали.

@ken-morel Мне нужна одна страница с двумя разными формами. Пользователь может переключаться между входом в систему и регистрацией с помощью функции скрытия JavaScript.

Mitchel Elusanmi 16.06.2024 01:19
Почему в Python есть оператор "pass"?
Почему в Python есть оператор "pass"?
Оператор pass в Python - это простая концепция, которую могут быстро освоить даже новички без опыта программирования.
Некоторые методы, о которых вы не знали, что они существуют в Python
Некоторые методы, о которых вы не знали, что они существуют в Python
Python - самый известный и самый простой в изучении язык в наши дни. Имея широкий спектр применения в области машинного обучения, Data Science,...
Основы Python Часть I
Основы Python Часть I
Вы когда-нибудь задумывались, почему в программах на Python вы видите приведенный ниже код?
LeetCode - 1579. Удаление максимального числа ребер для сохранения полной проходимости графа
LeetCode - 1579. Удаление максимального числа ребер для сохранения полной проходимости графа
Алиса и Боб имеют неориентированный граф из n узлов и трех типов ребер:
Оптимизация кода с помощью тернарного оператора Python
Оптимизация кода с помощью тернарного оператора Python
И последнее, что мы хотели бы показать вам, прежде чем двигаться дальше, это
Советы по эффективной веб-разработке с помощью Python
Советы по эффективной веб-разработке с помощью Python
Как веб-разработчик, Python может стать мощным инструментом для создания эффективных и масштабируемых веб-приложений.
1
1
58
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Если здесь ваша страница с двумя формами, используя плохое CSS-анимация и кнопки (можно использовать другой элемент) для переключения display: block; и display: none;

<div form-container>
  <div toggle-login-buttons-or-links>
    <button onclick = "switchToLogin()">
      login
    </button>
    or
    <button onclick = "switchToRegister()">
      register
    </button>
  </div>
  <div forms> <!-- default to login -->
    <form login    style = "transition: 0.5s;">...</form>
    <form register style = "transition: 0.5s; display: none;">...</form>
  </div>
  <script>
    function switchToLogin() {
      let
        login = document.querySelector("form[login]"),
        register = document.querySelector("form[register]");
      login.style.display = 'block':
      register.style.display = 'none':
    }
    function switchToRegister() {
      let
        login = document.querySelector("form[login]"),
        register = document.querySelector("form[register]");
      login.style.display = 'none':
      register.style.display = 'block':
    }
  </script>
</div>

Другие вопросы по теме