Проверка на заполнение

[Sav2907]

Нужно сделать проверку. При клике по "Отправить", нужно проверить все ли поля заполнены, если нет то сообщение "Не все поля заполнены"

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<div class="content">
	<input type="text" class="data"><input type="text" class="names"><br>
</div><br>
<button id="add">Добавить</button><button id="send">Отправить/button>
<script>
$('#add').on('click', function(){
	$('.content').append('<input type="text" class="data"><input type="text" class="names"><br>');	
});
</script>

[j0hnik]

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div class="content">
		<input type="text" class="data"><input type="text" class="names"><br>
	</div><br>
	<button id="add">Добавить</button><button id="send">Отправить</button>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script>
		$('#add').on('click', function(){
			$('.content').append('<input type="text" class="data"><input type="text" class="names"><br>');	
		});
		$('#send').on('click', function(){
			var a = 0;
			$('input').each(function(){
				if($(this).val().length<3) a = 1;
			});
			if(a) alert("Не все поля заполнены");
		});
	</script>
</body>
</html>

[Sav2907]

Спасибо большое

[Rasy]

j0hnik,

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div class="content">
    <input type="text" class="data">
    <input type="text" class="names">
    <br></div>
  <br>
  <button id="add">Добавить</button>
  <button id="send">Отправить</button>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script>
    $('#add').on('click', function(){
      $('.content').append('<input type="text" class="data"><input type="text" class="names"><br>');  
    });
    $('#send').on('click', function(){
      var a = $('input').filter(function(i, v) {
        return v.value.length<3;
      });
      if(a.length) alert("Не все поля заполнены");
    });
  </script></body>
</html>

[j0hnik]

Rasy,
Можно и так, вариантов тут на самом деле много

[j0hnik]

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div class="content">
    <input type="text" class="data">
    <input type="text" class="names">
    <br></div>
  <br>
  <button id="add">Добавить</button>
  <button id="send">Отправить</button>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script>
    $('#add').on('click', function(){
      $('.content').append('<input type="text" class="data"><input type="text" class="names"><br>');  
    });
    $('#send').on('click', function(){
      if([].some.call($('input'), el=> el.value.length < 3)) alert("Не все поля заполнены");
    });
  </script></body>
</html>

[Rasy]

Можно и так, вариантов тут на самом деле много

Согласен. Но. Если писать на jQuery лучше использовать подходящий для этого метод.
Метод массива some - нативный, и совместное использование с либой не совсем целесообразно. Плюс слабая поддержка синтаксиса es6.

[j0hnik]

Это я в качестве примера. насчет es6 согласен, а вот использовать ли нативные методы в JQ, если запись короче и быстрей, почему бы и нет, тут мешает только этическая точка зрения "чистоты кода".

[Rasy]

если запись короче и быстрей

Я об этом и говорю. На мой взгляд проще и быстрее написать метод filter, чем some.

[j0hnik]

Rasy,
на счет быстрей, filter будет до конца перебирать, some как только найдет сразу вернет true не перебирая до конца.