"Send" button, check number of digits in the password and if it is equal to another password in html/javascript

Asked

Viewed 48 times

-1

I am making a form, where the "send" data button needs to check the number of digits and check if it is equal to another password.

Html code

<div class="content">
   <input type="submit" class="botao01"  onclick="Salvar();" value="Salvar" />
</div>

Javascript

function Salvar(){
    var senha1 = document.f1.senha1.value;
    var senha2 = document.f1.senha2.value;

    if(senha1 === senha2){
        alert("SENHAS IGUAIS");
    }else{
        alert("SENHAS DIFERENTES");
    }
    if(senha.lenght>=6){
       alert("Dígitos minimo é 6");
    }
}

But it’s not checking...

javascript html5
  • 2

    Aline, review your question. HTML is incomplete and does not say what the purpose of the function Salvar() and how you are using it. In addition to there are errors such as the variable senha that does not exist and if you want to have at least 6 characters, the correct would be to use <6 (less than 6) and not >=6 (greater than or equal to 6).

  • <div class="input-div" id="input-password1"><b>Password:</b> <input type="password" required id="password1" name="password1" placeholder="Enter password " /> </div>

1 answer

0


Come on:

  1. Avoid using onclick right in HTML, this use is very old and discouraged nowadays, make the creation of Right System in JS.

  2. Do not access the elements directly as you are trying (document.f1.senha1....), use the default JS search that is most guaranteed, either by id (document.getElementById) or even by querySelector (document.querySelector("..."))

  3. To be required to type at least 6 digits, use length < 6 (size less than 6) and make this check before the others, so if you do not have the minimum of characters, you do not need to check if they are equal, because they are already invalid even...

In the code below, you can check everything I mentioned above in a functional example. 

document.getElementById("botaoSalvar").onclick = Salvar;

function Salvar(){
  var senha1 = document.getElementById("senha1").value;
  var senha2 = document.getElementById("senha2").value;

  if(senha1.length < 6 || senha2.length < 6){
     console.log("Dígitos minimo é 6");
     return;
  }

  if(senha1 === senha2){
     console.log("SENHAS IGUAIS");
  }else{
      console.log("SENHAS DIFERENTES");
      return;
  } 
}
<div class="content">
    <div class="input-div" id="input-senha1">
      <b>Senha:</b> 
      <input type="password" required id="senha1" name="senha1" placeholder="Insira senha..." />
      <input type="password" required id="senha2" name="senha2" placeholder="Senha novamente..." />
    </div> 
    <input type="submit" class="botao01" id="botaoSalvar" value="Salvar" />
  </div>

Browser other questions tagged javascript html5

You are not signed in. Login or sign up in order to post.