Сравнение данных в “input” с данными в объекте

403

06 февраля 2017, 17:38

Все было бы прекрасно, но проблема с последним else if. Он с каждым объектом выдает alert независимо значение true или false. А мне нужно чтобы выдал один раз когда false.

$(document).ready(function() { 
  var users = [{ 
    "name": "A", 
    "password": "1" 
  }, { 
    "name": "B", 
    "password": "2" 
  }, { 
    "name": "C", 
    "password": "3" 
  }, { 
    "name": "D", 
    "password": "4" 
  }]; 
 
  $(document).on("click", ".check-data", function() { 
    var CheckName = $('.check-name').val(); 
    var CheckPassword = $('.check-pass').val(); 
 
    for (var i = 0; i < users.length; i++) { 
      var DataName = users[i].name; 
      var DataPassword = users[i].password; 
 
      if (CheckName === DataName && CheckPassword === DataPassword) { 
        alert('Connected'); 
        break; 
      } else if (CheckName === "" && CheckPassword === "") { 
        alert('Required to enter a name and password'); 
        break; 
      } else if (CheckName === DataName && CheckPassword === "") { 
        alert('Required to enter a password'); 
        break; 
      } else if (CheckName === DataName && CheckPassword !== DataPassword) { 
        alert('Wrong password'); 
        break; 
      } else if (CheckName !== DataName) { 
        alert('Name not found'); 
      } 
    } 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
  <a>Check Name</a> 
  <input class="check-name"></input> 
  <br> 
  <a>Check Password</a> 
  <input class="check-pass" type="password"></input> 
  <br> 
  <button class="check-data">Check Data in object</button> 
</form>

Answer 1

Вы же понимаете, что такой способ авторизации бесполезен на сайте? Любой может открыть исходный код странице и узнать пароль! Проверка пароля должна производится сервером!

Но, давайте представим, что этот пример просто для обучения JS.

Вы циклом перебираете значения и производите проверки, которые должны быть на разных этапах?

Во-первых, не нужно проверять пустое ли поле, с каждым юзером, проверьте значения перед циклом:

 if (CheckName === "" ) {
        alert('Required to enter a name');
        return;;
 } 
 if (CheckPassword === "") {
        alert('Required to enter a password');
        return;;
 }

Во-вторых, перебирая имена, не надо каждый раз выводить ошибку. Создайте переменную, которая будет фиксировать найден ли пользователь:

 var namefound = false;
 for (var i = 0; i < users.length; i++) {
       if (CheckName === DataName) {
            namefound = true;
       }
 ...

И если совпадения не произошло, выведите ошибку в конце:

 if (!namefound) {
      alert('Name not found');
      return;
 }

$(document).ready(function() { 
  var users = [{ 
    "name": "A", 
    "password": "1" 
  }, { 
    "name": "B", 
    "password": "2" 
  }, { 
    "name": "C", 
    "password": "3" 
  }, { 
    "name": "D", 
    "password": "4" 
  }]; 
  
  $(document).on("click", ".check-data", function() { 
    var namefound = false; 
    var CheckName = $('.check-name').val(); 
    var CheckPassword = $('.check-pass').val(); 
 
 
    if (CheckName === "") { 
      alert('Required to enter a name'); 
      return; 
    } else if (CheckPassword === "") { 
      alert('Required to enter a password'); 
      return; 
    } 
 
    for (var i = 0; i < users.length; i++) { 
      var DataName = users[i].name; 
      var DataPassword = users[i].password; 
      if (CheckName === DataName) { 
        namefound = true; 
      } 
      if (CheckName === DataName && CheckPassword === DataPassword) { 
        alert('Connected'); 
        Connected = true; 
        break; 
      } else if (CheckName === DataName && CheckPassword !== DataPassword) { 
        alert('Wrong password'); 
        return; 
      } 
 
    } 
    if (!namefound) { 
      alert('Name not found'); 
      return; 
    } 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
  <a>Check Name</a> 
  <input class="check-name"></input> 
  <br> 
  <a>Check Password</a> 
  <input class="check-pass" type="password"></input> 
  <br> 
  <button class="check-data">Check Data in object</button> 
</form>

Answer 2

Вы break забыли написать, из-за чего цикл не прерывается.

Имхо, называйте переменные по другому. CheckName вводит заблуждение, кажется, что это функция которая проверяет имя. Можете например testedName или просто name.