'Redirecting to register div section when form validation errors
my login and register are on the same page using css card back and front 3D rotation to display the 2 different forms by toggle with checkbox input.
when my form errors, it redirects back to the card front, and only shows the errors when the register side is toggled again. is there any way to redirect it back to the register card back div when form validation fails?
<div class="section">
<div class="container">
<div class="row full-height justify-content-center">
<div class="col-12 text-center align-self-center py-5">
<div class="section pb-5 pt-5 pt-sm-2 text-center">
<h6 class="mb-0 pb-3"><span>Log In </span><span>Sign Up</span></h6>
<input class="checkbox" type="checkbox" id="reg-log" name="reg-log"/>
<label for="reg-log"></label>
<div class="card-3d-wrap mx-auto">
<div class="card-3d-wrapper">
<div id="lgn" class="card-front" >
<div class="center-wrap">
<div class="section text-center">
<h4 class="mb-4 pb-3" style="color:#47E10C;">Log In</h4>
<br>
<form action="{{ url_for('login') }}" method="POST">
{{ login_form.hidden_tag() }}
<div class="form-group">
{{ login_form.email.label(class="form-control-label") }}
{% if login_form.email.errors %}
{{ login_form.email(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in login_form.email.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ login_form.email(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ login_form.password.label(class="form-control-label") }}
{% if login_form.password.errors %}
{{ login_form.password(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in login_form.password.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ login_form.password(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ login_form.login_submit(class="btn") }}
</div>
</form>
<p class="mb-0 mt-4 text-center"><a href="#0" class="link">Forgot your password?</a></p>
</div>
</div>
</div>
<div class="card-back" id="reg">
<div class="center-wrap">
<div class="section text-center">
<h4 class="mb-4 pb-3" style="color:#47E10C;">Sign Up</h4>
<form action="{{ url_for('register') }}" method="POST">
{{ register_form.hidden_tag() }}
<div class="form-group">
{{ register_form.first_name.label(class="form-control-label") }}
{% if register_form.first_name.errors %}
{{ register_form.first_name(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in register_form.first_name.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ register_form.first_name(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ register_form.last_name.label(class="form-control-label") }}
{% if register_form.last_name.errors %}
{{ register_form.last_name(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in register_form.last_name.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ register_form.last_name(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ register_form.email.label(class="form-control-label") }}
{% if register_form.email.errors %}
{{ register_form.email(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in register_form.email.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ register_form.email(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ register_form.password.label(class="form-control-label") }}
{% if register_form.password.errors %}
{{ register_form.password(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in register_form.password.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ register_form.password(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ register_form.confirm.label(class="form-control-label") }}
{% if register_form.confirm.errors %}
{{ register_form.confirm(class="form-control form-control-lg is-invalid") }}
<div class="invalid-feedback">
{% for error in register_form.confirm.errors %}
<span>{{ error }}</span>
{% endfor %}
</div>
{% else %}
{{ register_form.confirm(class="form-control form-control-lg") }}
{% endif %}
</div>
<br>
<div class="form-group">
{{ register_form.reg_submit(class="btn") }}
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|