Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Валидация инпутов (https://javascript.ru/forum/dom-window/81888-validaciya-inputov.html)

venom1996 10.02.2021 13:34
Валидация инпутов
 
Можно ли сделать валидацию всех инпутов который с атрибутом type=text? на странице около 70 инпутов, и все их нужно проверить на заполнение, так как отдельно брать селектор инпута и проверять не вариант

рони 10.02.2021 14:05
Цитата:
Сообщение от venom1996
и все их нужно проверить на заполнение,
required?

venom1996 10.02.2021 14:11
форма отправляется аjaxом, и если инпуты с типом текст не заполнены, то ну допустим просто аллертом выводит ошибку, а если заполнены просто делать ajax запрос

рони 10.02.2021 14:14
venom1996,
что мешает циклом обойти все [type=text]?

venom1996 10.02.2021 14:14
думал сначала так
var validates = document.queryselectorAll('input[type=text]')
if(validates.checkValidity) {
и выполняем условие
}else {
alert('Ошибка')
}

но так не работает

рони 10.02.2021 14:18
venom1996,
let validate = [...document.querySelectorAll('[type="text"]')].every(({value}) => value.trim());
if(validate) //посылаем запрос

venom1996 10.02.2021 14:27
а value это что ? и зачем оборачивать это в []

рони 10.02.2021 14:35
Цитата:
Сообщение от venom1996
а value это что ?
это то что ввели или не ввели в поле input.
Цитата:
Сообщение от venom1996
и зачем оборачивать это в []
чтобы получить массив и использовать цикл (every)по всем элементам массива.

рони 10.02.2021 14:37
venom1996,
every

Цитата:
Метод every() проверяет, удовлетворяют ли все элементы массива условию, заданному в передаваемой функции.

venom1996 10.02.2021 14:57 
var validate = [document.querySelectorAll('[type="text"]')].every(({value}) => value.trim());
а что мне написать в value ? не много не понимаю, и пытаюсь так 
var validate = [...document.querySelectorAll('[type="text"]')].every(({' '}) => value.trim());
или перед этим создать переменную value с пустым значением ? мне просто нужно что бы если значение пустое, у этих инпутов, то запрос не делать, ещё пытался так 
if (validate !== '') 
//выполнять условие

но так не работает

рони 10.02.2021 14:59
Цитата:
Сообщение от venom1996
а что мне написать в value ?
ничего! это содержимое инпут, код надо просто использовать

рони 10.02.2021 15:06
venom1996,
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
</head>
<body>
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input name="" type="button" value="Go">
    <script>
document.querySelector('[type="button"]').addEventListener( "click" , function(event) {
event.preventDefault();
let validate = [...document.querySelectorAll('[type="text"]')].every(({value}) => value.trim());
if(validate) location = "https://ya.ru";
else alert("одно или несколько полей незаполнено");
});
    </script>
</body>
</html>

voraa 10.02.2021 16:53
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<input type="text" required>
<input type="text" required>
<input type="text" required>
<input type="text" required>
<input type="text" required>
<input name="" type="button" value="Go">
<script>
document.querySelector('[type="button"]').addEventListener( "click" , function(event) {
event.preventDefault();
if(document.querySelectorAll('[type="text"]:invalid').length)
alert("одно или несколько полей незаполнено");
else location = "https://ya.ru";
});
</script>
</body>
</html>


Часовой пояс GMT +3, время: 17:29.