Problema validazione regole password

**fabiodj** · 20-01-2023, 17:09

Nel seguente form ho il seguente problema: quando io cominicio a scrivere la passeord dovrebbe evidenziare le regole in basso ....
La pagina è disponibile anche al seguente link http://www.all-forevents.com/moduloutente.htm

codice HTML:

<html><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css" /><script src="https://code.jquery.com/jquery-3.6.2.min.js"></script><body>  <style>
    .form-group {position: relative;}
    .bi-eye-slash {      display:block;                       color: 1px solid red;                       z-index:1000;                       cursor: pointer;                       position: absolute;                        top: 4px; left:250px;        }
#password_rules ul li {        /*font-size: 12px;        font-weight: normal;*/        color: #000000;    }
    #password_rules ul li.complete {        color: #5DB406;    }</style><h4 align=center>Modifica dati utente</h4> <form class="form-horizontal" method="POST" name="modello" action="updateutente.asp"><input type ="hidden" name="IDut" value="<%=IDdip%>"> <div class="area-form"><div class="form-group"><label class="control-label" for="pwd">Password</label><input type="password" id="password" name="password" class="form-control inputstl" value="<%=password%>"><i class="bi bi-eye-slash" id="togglePassword"></i></div>		<div class="form-group"><label class="control-label" for="conferma_password">Nuova password</label><input type="password" name="conferma_password" id="cfpwd" class="form-control inputstl"><i class="bi bi-eye-slash" id="cftogglePassword"></i></div>	
  <div id="password_rules">        <h4>La password deve avere le seguenti caratteristiche:</h4>        <ul>            <li class="password_length">Almeno 8 caratteri</li>            <li class="password_uppercase">Almeno una lettera maiuscola</li>            <li class="password_number">Almeno un numero</li>            <li class="password_match">Le password devono corrispondere</li>        </ul>	</div>   <div class="text-center">        <button type="submit" class="btn btn-primary">Salva</button>        <button type="reset" class="btn btn-primary">Annulla</button> </div>  </div>  </form>

codice HTML:

<script>
$(document).ready(function() {var validateInput = $('input.validate');function validateInputs() {var password = $('#password').val(),conf = $('#cfpwd').val(), all_pass = true;var uppercase = password.match(/[A-Z]/),number = password.match(/[0-9]/);
if (password.length < 8) {$('.password_length').removeClass('complete');all_pass = false;} else $('.password_length').addClass('complete');
if (uppercase) $('.password_uppercase').addClass('complete');else {$('.password_uppercase').removeClass('complete');all_pass = false;}                if (number) $('.password_number').addClass('complete');else {$('.password_number').removeClass('complete');all_pass = false}
if (password == conf && password != '') $('.password_match').addClass('complete');else {$('.password_match').removeClass('complete')all_pass = false;}            }                });
</script>

**ciro78** · 20-01-2023, 21:09

il codice è formattato male. ma da quello che vedo tu fai il controllo quando carichi la pagina. il controllo lo devi fare sull'evento change del campo password

**fabiodj** · 21-01-2023, 04:16

Ho modificato il codice in questo modo richiamando il tutto nella funzione onkeyup; in questo modo riesco a verificare le regole della password; adesso però risulta necessario verificare che password e conferma password corrispondano ma penso che ci sia un errore nel codice che non riesco a capire.

codice HTML:

$(document).ready(function() {
$("#password").keyup(function() {
var password = $('#password').val();
conf = $('#cfpwd').val();
all_pass = true;
var uppercase = password.match(/[A-Z]/);
number = password.match(/[0-9]/);

if (password.length < 8) {$('.password_length').removeClass('complete');
all_pass = false;} 
else $('.password_length').addClass('complete');

if (uppercase) $('.password_uppercase').addClass('complete');
else {$('.password_uppercase').removeClass('complete');
all_pass = false;}            

if (number) $('.password_number').addClass('complete');
else {$('.password_number').removeClass('complete');
all_pass = false}

$("#cfpwd").keyup(function() {
if (password == conf && password != '') 
$('.password_match').addClass('complete');
else {$('.password_match').removeClass('complete')
all_pass = false;}
})
   }) 
  });

Discussione: Problema validazione regole password

Strumenti discussione

Ricerca discussione

Visualizza

Problema validazione regole password

Permessi di invio