Two conditions in the same loop if () javascript

Navigation
2

I can not prevent the submit button from performing your action if the information you entered is not the same, could someone help me?

HTML 

<form method="post" action="php/cadastro.php">
    <span class="form_title">Cadastre-se</span>
    <fieldset>
        <input type="text" name="nome" class="txt_input first_input" placeholder="Nome">
        <input type="email" name="email" class="txt_input" id="email" placeholder="E-mail">
        <input type="email" name="confirmaEmail" class="txt_input" id="confirma-email" placeholder="Confirmar e-mail">
        <input type="password" name="senha" class="txt_input" id="senha" placeholder="Senha">
        <input type="password" name="confirmaSenha" class="txt_input" id="confirma-senha" placeholder="Confirmar senha">
    </fieldset>
    <fieldset>
        <input type="checkbox" name="termos">
        <p>Eu concordo com os <span>termos de uso e política de privacidade</span> do WEB TRAINING</p>
    </fieldset>
    <fieldset class="buttons">
        <input type="submit" name="Cadastrar" value="Cadastrar" class="log_btn" id="cadastro-btn" onclick="valida()">
        <input type="button" name="Voltar" value="Voltar" class="log_btn volta_btn" id="volta-btn" onclick="voltar()">
    </fieldset>
</form>

Javascript 

   var email = document.getElementById('email');
var confirmaEmail = document.getElementById('confirma-email');

var senha = document.getElementById('senha');
var confirmaSenha = document.getElementById('confirma-senha');

var cadastrar = document.getElementById('cadastro-btn');

    function valida(){

        if(email != confirmaEmail || senha != confirmaSenha){
            cadastrar.preventDefault();
        }

    };

* The script is already linked at the end of HTML * I tried the forms you sent, but none worked

    
asked by anonymous 02.08.2016 / 19:50

3 answers

6

I had some syntax errors, in if(...) and ); more after the function valida() , I think that's how you want it: 

function valida(e){

   var email = document.getElementById('email').value;
   var confirmaEmail = document.getElementById('confirma-email').value;

   var senha = document.getElementById('senha').value;
   var confirmaSenha = document.getElementById('confirma-senha').value;

   if (email != confirmaEmail  || senha != confirmaSenha) {
       e.preventDefault();
   }

}
<form method="post" action="php/cadastro.php">
            <span class="form_title">Cadastre-se</span>
        <fieldset>
            <input type="text" name="nome" class="txt_input first_input" placeholder="Nome">
            <input type="email" name="email" class="txt_input" id="email" placeholder="E-mail">
            <input type="email" name="confirmaEmail" class="txt_input" id="confirma-email" placeholder="Confirmar e-mail">
            <input type="password" name="senha" class="txt_input" id="senha" placeholder="Senha">
            <input type="password" name="confirmaSenha" class="txt_input" id="confirma-senha" placeholder="Confirmar senha">
        </fieldset>
        <fieldset>
            <input type="checkbox" name="termos">
            <p>Eu concordo com os <span>termos de uso e política de privacidade</span> do WEB TRAINING</p>
        </fieldset>
        <fieldset class="buttons">
            <input type="submit" name="Cadastrar" value="Cadastrar" class="log_btn" id="cadastro-btn" onclick="valida(event)">
            <input type="button" name="Voltar" value="Voltar" class="log_btn volta_btn" id="volta-btn" onclick="voltar()">
        </fieldset>
</form>

I put the .value that escaped me, the other answers drew my attention to this. Very important is also to get the values inside the function otherwise it will have the wrong values (those that are in the load of the page and not those that are filled when trying to submit the form). Corrigi

    
02.08.2016 / 19:55
8

You have missed the value of each input and specify the operator that joins the expressions.

When doing document.getElementById('email'); this takes the whole element, in your case you should only get the value then specify the value property for each element.

Change; 

var email = document.getElementById('email');

To: 

var email = document.getElementById('email').value;

And add the operator between the expressions 

if (email != confirmaEmail ||  senha != confirmaSenha) {
    
02.08.2016 / 19:57
8

The .preventDefault() should apply to an event, not an element. Pass the event to the function and you can cancel the event: 

onclick="valida(event)"> // no HTML

And in JavaScript 

function valida() {
    if (email.value != confirmaEmail.value || senha.value != confirmaSenha.value) { // <-- faltava um "||" aqui
        cadastrar.preventDefault();
    }
} // <-- tinhas aqui um ")" a mais...

jsFiddle: link

Note: You must use .value to read the property of the element. Otherwise you'll be comparing elements of the DOM and not their value, like the #.

    

02.08.2016 / 19:57
Sum of cousins in a range in C How to mount the HTML of a "select" via PHP, using data coming from the DB