57 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			57 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| {% extends "base_settings_page.html" %}
 | |
| {% block content %}
 | |
| <form id="change_password_form" action="/settings/change_password" method="post">
 | |
|     <div class="form-group">
 | |
|         <label for="currPassword" class="form-label mt-4">Current password</label>
 | |
|         <input type="password" name="old_pass" class="form-control"
 | |
|                id="currPassword" placeholder="Your current password" required />
 | |
|     </div>
 | |
| 
 | |
|     <div> </div>
 | |
| 
 | |
|     <div class="form-group">
 | |
|         <label for="newPassword" class="form-label mt-4">New password</label>
 | |
|         <input type="password" name="new_pass" class="form-control" id="newPassword"
 | |
|                placeholder="New password" minlength="{{ min_pwd_len }}" />
 | |
|         <div class="invalid-feedback" id="errNewPass"></div>
 | |
|         <small class="form-text text-muted">Please choose a password of at least {{ min_pwd_len }} characters.</small>
 | |
|     </div>
 | |
| 
 | |
|     <div class="form-group">
 | |
|         <label for="confirmNewPassword" class="form-label mt-4">Confirm new password</label>
 | |
|         <input type="password" class="form-control" id="confirmNewPassword" placeholder="Confirm new password">
 | |
|     </div>
 | |
| 
 | |
|     <div> </div>
 | |
|     <div> </div>
 | |
|     <div> </div>
 | |
| 
 | |
|     <button type="submit" class="btn btn-primary">Change password</button>
 | |
| </form>
 | |
| 
 | |
| <script>
 | |
|     const form = document.getElementById("change_password_form");
 | |
|     const errPass1 = document.getElementById("errNewPass");
 | |
|     form.addEventListener("submit", (e) => {
 | |
|         e.preventDefault();
 | |
| 
 | |
|         const pass1 = document.getElementById("newPassword");
 | |
|         const pass2 = document.getElementById("confirmNewPassword");
 | |
| 
 | |
|         errPass1.innerHTML = "";
 | |
|         pass1.classList.remove("is-invalid");
 | |
| 
 | |
|         if (pass1.value.length < {{ min_pwd_len }}) {
 | |
|             errPass1.innerHTML = "Your password must have at least {{ min_pwd_len }} characters!";
 | |
|             pass1.classList.add("is-invalid");
 | |
|         }
 | |
|         else if (pass1.value !== pass2.value) {
 | |
|             errPass1.innerHTML = "The password and its confirmation are not the same !";
 | |
|             pass1.classList.add("is-invalid");
 | |
|         }
 | |
|         else
 | |
|             form.submit();
 | |
|     })
 | |
| </script>
 | |
| 
 | |
| {% endblock content %} |