Scroll array until you find a certain index

Navigation
0

I have the following code JS : 

var botao = document.querySelector('input[type="submit"]');

    botao.addEventListener('click', function(e) {
        let form = document.querySelector('form');

        let ipt = {
             nome: form.nome.value,
             senha: form.senha.value                 
        }

        var users = [
          {nome: "Jorge", senha: "123"},
          {nome: "Joao", senha: "joao"},
          {nome: "Maria", senha: "maria"},
          {nome: "José", senha: "jose"},
          {nome: "Ana", senha: "ana"},
        ]

            for(let i = 0; i<users.length; i++) {                           
                if (ipt.nome == users[i].nome && ipt.senha == users[i].senha) {
                    e.preventDefault();
                    alert('Bem vindo ' + form.nome.value + " !");
                    window.location.href= "http://www.google.com.br";                       
                }
                else {                      
                    e.preventDefault();
                    alert('Dados incorretos!');                     
                }

            }       
    });

and the following html : 

<form name="form1" id="form1">
         <input name="nome" type="text" placeholder="Usuário "/> 
         <input name="senha" type="password" placeholder="Senha "/> 
         <input type="submit" value="Login"/>
      </form>

I'm doing a check according to the indexes of the users vector, the problem is that: When checking that the user exists, it will print Dados incorretos until you get the correct index and print the welcome message and make the redirect.

See the example below: 

var botao = document.querySelector('input[type="submit"]');

    botao.addEventListener('click', function(e) {
        let form = document.querySelector('form');

        let ipt = {
             nome: form.nome.value,
             senha: form.senha.value                 
        }

        var users = [
          {nome: "Jorge", senha: "123"},
          {nome: "Joao", senha: "joao"},
          {nome: "Maria", senha: "maria"},
          {nome: "José", senha: "jose"},
          {nome: "Ana", senha: "ana"},
        ]

            for(let i = 0; i<users.length; i++) {                           
                if (ipt.nome == users[i].nome && ipt.senha == users[i].senha) {
                    e.preventDefault();
                    console.log('Bem vindo ' + form.nome.value + " !");
                    //window.location.href= "http://www.google.com.br";                       
                }
                else {                      
                    e.preventDefault();
                    console.log('Dados incorretos!');                     
                }

            }       
    });
<form name="form1" id="form1">
    	     <input name="nome" type="text" value="Ana" placeholder="Usuário "/> 
             <input name="senha" value="ana" type="password" placeholder="Senha "/>	
    		 <input type="submit" value="Login"/>
    	  </form>

See that it prints 4 messages from dados incorretos to only after printing bem vindo .

Can anyone help me?

    
asked by anonymous 05.03.2018 / 16:57

3 answers

2
var b = false

for(let i = 0; i<users.length; i++) {                           
    if (ipt.nome == users[i].nome && ipt.senha == users[i].senha) {
        e.preventDefault();
        console.log('Bem vindo ' + form.nome.value + " !");
        //window.location.href= "http://www.google.com.br";
        b = true                       
    }
} 

if(b == false) {                      
    e.preventDefault();
    console.log('Dados incorretos!');                     
}

Create a boolean variable false before for , if in the middle of the loop find a correct user / password change the variable to true , when finished if it is still false show the message 

for(let i = 0; i<users.length; i++) {                           
    if (ipt.nome == users[i].nome && ipt.senha == users[i].senha) {
        e.preventDefault();
        console.log('Bem vindo ' + form.nome.value + " !");
        //window.location.href= "http://www.google.com.br";
    } else if(i == users.length - 1) {                      
        e.preventDefault();
        console.log('Dados incorretos!');                     
    }
}

Or else within for also check if i is equal to users size

    
05.03.2018 / 17:04
0

Use Array.find to fetch an element from the array if the element is not found, return is undefined 

search = users.find(user => user.nome==ipt.nome && user.senha==ipt.senha)

if(search){
  e.preventDefault();
  console.log('Bem vindo ' + form.nome.value + " !");
  //window.location.href= "http://www.google.com.br";
}
else{
  e.preventDefault();
  console.log('Dados incorretos!');   
}

NOTE: I hope you are not doing an access control system this way, because anyone can open the javascript and see which users are declared in their variable users

    
05.03.2018 / 17:36
0

You can use filter of Javascript , which is a function where you compare what you are looking for so that it returns a boolean , and can replace for 

var users = [
          {nome: "Jorge", senha: "123"},
          {nome: "Joao", senha: "joao"},
          {nome: "Maria", senha: "maria"},
          {nome: "José", senha: "jose"},
          {nome: "Ana", senha: "ana"},
        ]

var n = 'Joao'; // nome procurado
var s = 'joao'; // senha procurada

var u = users.filter(function(user){ 
    return user.nome == n && user.senha == s; 
});

if (u.length > 0) {
   console.log('Bem-vindo ' + u[0].nome);
} else {
   console.log('Dados incorretos');
}
    
05.03.2018 / 17:37
Redirect to external link in Laravel Problem with recursive function, 2 parameters