Files
digest_app/templates/module_auth/password_reset_confirm.html
2024-04-08 00:33:02 +05:30

89 lines
3.4 KiB
HTML

{% extends 'base_structure/layout/base_authentication_template.html' %}
{% load i18n static %}
{% block content %}
<div class="card mt-3 mb-3">
<div class="card-header">
<h3 class="text-center font-weight-light my-4">Password Reset Confirm</h3>
{% include 'base_structure/elements/message.html' %}
</div>
<div class="card-body">
{% if validlink %}
<form method="post" id="changePasswordForm">
{% csrf_token %}
<div class="form-group">
<input type="hidden" class="form-control" id="id_username" name="username"
value="{{ form.user.get_username }}" autocomplete="username">
</div>
<div class="form-group">
<label for="id_new_password1">{% translate 'New password:' %}</label>
<input type="password" class="form-control" id="id_new_password1" name="new_password1">
{{ form.new_password1.errors }}
</div>
<div class="form-group">
<label for="id_new_password2">{% translate 'Confirm password:' %}</label>
<input type="password" class="form-control" id="id_new_password2" name="new_password2">
{{ form.new_password2.errors }}
</div>
<button type="submit" class="btn btn-primary mt-4">{% translate 'Change my password' %}</button>
</form>
{% else %}
<p>{% translate "The password reset link was invalid, possibly because it has already been used. Please request a new password reset." %}
</p>
{% endif %}
</div>
</div>
{% endblock content%}
{% block javascript %}
<!-- include required js cdn link through html here -->
<script>
$(document).ready(function() {
$('#changePasswordForm').validate({
rules: {
new_password1: {
required: true,
// Add custom method for password complexity
complexPassword: true
},
new_password2: {
required: true,
equalTo: '#id_new_password1'
}
},
messages: {
new_password1: {
required: "Please enter a new password."
},
new_password2: {
required: "Please confirm your new password.",
equalTo: "Passwords do not match."
}
},
errorElement: 'div',
errorPlacement: function(error, element) {
error.addClass('invalid-feedback');
element.closest('.form-group').append(error);
},
highlight: function(element, errorClass, validClass) {
$(element).addClass('is-invalid').removeClass('is-valid');
},
unhighlight: function(element, errorClass, validClass) {
$(element).removeClass('is-invalid').addClass('is-valid');
}
});
// Add custom validation method for password complexity
$.validator.addMethod("complexPassword", function(value, element) {
return /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*()_+}{":;'?/>.<,])(?=.*[^\w\d\s])/.test(value);
}, "Password must include at least one uppercase letter, one lowercase letter, one number, and special characters.");
});
</script>
{% endblock %}