Проверка input на заполненность

@masta · Регистрация: 15.05.2013

Студворк — интернет-сервис помощи студентам

Здравствуйте. Есть простенькая форма с торговыми предложениями:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<form  id="add2basket-modal_70332" action="add2basket.php" method="post" enctype="multipart/form-data">
            <div class="collapse fade" data-parent="#accordionOffer_70332" aria-labelledby="black_heading_70332" id="black_70332">
                <div class="row">
                    <span class="offer_row offer_row_1">Цвет</span>
                    <span class="offer_row offer_row_2">Размер</span>
                    <span class="offer_row offer_row_3">Склад</span>
                    <span class="offer_row offer_row_4">Заказ</span>
                </div>          
                <div class="row">
                        <span class="offer_row offer_row_1">Черный</span>
                        <span class="offer_row offer_row_2">S</span>
                        <span class="offer_row offer_row_3">24</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109303" id="109303" class="offer_input"></span>
                </div>              
                <div class="row">
                        <span class="offer_row offer_row_1">Черный</span>
                        <span class="offer_row offer_row_2">M</span>
                        <span class="offer_row offer_row_3">31</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109300" id="109300" class="offer_input"></span>
                </div>                  
                <div class="row">
                        <span class="offer_row offer_row_1">Черный</span>
                        <span class="offer_row offer_row_2">L</span>
                        <span class="offer_row offer_row_3">32</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109299" id="109299" class="offer_input"></span>
                </div>                      
                <div class="row">
                        <span class="offer_row offer_row_1">Черный</span>
                        <span class="offer_row offer_row_2">XL</span>
                        <span class="offer_row offer_row_3">33</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109298" id="109298" class="offer_input"></span>
                </div>                      
                <div class="row">
                        <span class="offer_row offer_row_1">Черный</span>
                        <span class="offer_row offer_row_2">2XL</span>
                        <span class="offer_row offer_row_3">33</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109295" id="109295" class="offer_input"></span>
                </div>                  
        </div>
            
            <div class="collapse fade" data-parent="#accordionOffer_70332" aria-labelledby="beige_heading_70332" id="beige_70332">
                <div class="row">
                    <span class="offer_row offer_row_1">Цвет</span>
                    <span class="offer_row offer_row_2">Размер</span>
                    <span class="offer_row offer_row_3">Склад</span>
                    <span class="offer_row offer_row_4">Заказ</span>
                </div>          
                <div class="row">
                        <span class="offer_row offer_row_1">Телесный</span>
                        <span class="offer_row offer_row_2">L</span>
                        <span class="offer_row offer_row_3">80</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109302" id="109302" class="offer_input"></span>
                </div>                      
                <div class="row">
                        <span class="offer_row offer_row_1">Телесный</span>
                        <span class="offer_row offer_row_2">S</span>
                        <span class="offer_row offer_row_3">68</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109301" id="109301" class="offer_input"></span>
                </div>                  
                <div class="row">
                        <span class="offer_row offer_row_1">Телесный</span>
                        <span class="offer_row offer_row_2">2XL</span>
                        <span class="offer_row offer_row_3">52</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109297" id="109297" class="offer_input"></span>
                </div>                  
                <div class="row">
                        <span class="offer_row offer_row_1">Телесный</span>
                        <span class="offer_row offer_row_2">M</span>
                        <span class="offer_row offer_row_3">76</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109296" id="109296" class="offer_input"></span>
                </div>          
                <div class="row">
                        <span class="offer_row offer_row_1">Телесный</span>
                        <span class="offer_row offer_row_2">XL</span>
                        <span class="offer_row offer_row_3">67</span>
                        <span class="offer_row offer_row_4"><input type="text" name="qantity_109294" id="109294" class="offer_input"></span>
                </div>              
        </div>
    
    <input type="hidden" name="uri" value="/b2bcabinet/orders/blank_zakaza/index.php?clear_cache=Y">
    <button id="submit_109294" class="btn btn-default add_to_cart"> <i class="icon-cart-add2"></i>В корзину</button>
</form>

В ней есть несколько полей input.
Как сделать, что бы при нажатии на кнопку "В корзину" происходила проверка на наличие значения хотя бы у одного input(если все заполнены, то тоже допустимо), если нет, то например alert("Введите кол-во")

Добавлено через 10 минут
Я попробовал сделать что-то типа:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$(document).ready(function(){
    $("form").submit(function(event){
        var error = true;
        var inputs = $("form input");
        console.log(inputs);
        inputs.each(function(){
            if($(this).val() !== ""){
               var error = false;
               break; 
            }
        })
        if(error===true){
            alert("Заполните все обязательные поля");
        }
})

Но пишет Uncaught SyntaxError: Illegal break statement

Добавлено через 2 минуты
А если break убрать, то Uncaught SyntaxError: Unexpected end of input

@amr-now · 30.01.2020, 20:37

Здравствуйте.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
        $(function onLoad() {
            $("#add2basket-modal_70332").submit(form_submit);
        });
 
        function form_submit() {
            var inputs = $(".row input[type=text]");
 
            for (var i = 0; i < inputs.length; i++){
                if (inputs[i].value.match(/^\d+$/)) {
                    return true; // наличие значения хотя бы у одного input(
                }
            }
            alert("Введите кол-во");
            return false;
        }

@masta · 30.01.2020, 21:33 **[ТС]**

amr-now, спасибо, работает, только я ещё хочу немного допилить эту функцию и для первого дива с классом collapse добавить класс show, я строчку дописал, так как это представляю, но что-то не работает, видимо потому что я больще backend'щик)

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$(document).ready(function(){
    $(function onLoad() {
            $("#add2basket-modal_<?=$item['ID']?>").submit(form_submit);
        });
 
        function form_submit() {
            var inputs = $(".row input[type=text]");
 
            for (var i = 0; i < inputs.length; i++){
                if (inputs[i].value.match(/^\d+$/)) {
                    return true; // наличие значения хотя бы у одного input(
                }
            }
            //console.log($('#add2basket-modal_<?=$item['ID']?>').find('.collapse'));
            $('#add2basket-modal_<?=$item['ID']?>').find('.collapse').eq(0).addClass('show');//т.к. это в списке карточек товара, то к id формы подставляется id товара, потом я пытаюсь найти дивы с классом collapse, выбрать из них первый и добавить класс show 
            alert("Введите кол-во");
            return false;
        }
})

Добавлено через 7 минут
А всё, допилил, надо было через родителя искать

JavaScript
1
$('#add2basket-modal_<?=$item['ID']?>').parent().find('.collapse').eq(0).addClass('show');

@amr-now · 31.01.2020, 05:38

masta, а теперь то же самое с учётом смысла:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
        $(function onLoad() {
           $("#add2basket-modal_<?=$item['ID']?>").submit(form_submit);
        });
 
        function form_submit() {
            var inputs = $(".row input[type=text]");
 
            for (var i = 0; i < inputs.length; i++){
                if (inputs[i].value.match(/^\d+$/)) {
                    return true; // наличие значения хотя бы у одного input(
                }
            }
           // Ваша добавленная строка с show
            alert("Введите кол-во");
            return false;
        }

Эту строку я не понял $('#add2basket-modal_<?=$item['ID']?>').parent().find('.collapse').eq(0).addClass('show');
Зачем для формы искать родителя формы? И почему только в случае, если количество не введено? А когда потом ввели количество, кто show будет убирать?

-----
Но onload это и есть ready(),
а функцию в функцию лишний раз не вкладывайте. Здесь не тот случай, чтобы вкладывать.

@masta · 31.01.2020, 05:51 **[ТС]**

amr-now, Ну тут смысл такой, есть карточки товара, в них есть торговые предложения, если просто кликнуть по кнопке в корзину без заполнения, выскакивает меню с выбором цвета и говорит что надо заполнить поле.

Почему через родителя? Ну потому что кнопка находится на уровень ниже чем инпуты, так на прямую не находит.

Show убирается при повторном клике на цвет торгового предложения.

Ну уже получилось как я хотел, спасибо!

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@masta 18 / 15 / 8 Регистрация: 15.05.2013 Сообщений: 212
	31.01.2020, 05:51 [ТС]
	amr-now, Ну тут смысл такой, есть карточки товара, в них есть торговые предложения, если просто кликнуть по кнопке в корзину без заполнения, выскакивает меню с выбором цвета и говорит что надо заполнить поле. Почему через родителя? Ну потому что кнопка находится на уровень ниже чем инпуты, так на прямую не находит. Show убирается при повторном клике на цвет торгового предложения. Ну уже получилось как я хотел, спасибо! Миниатюры 0

Проверка input на заполненность

Решение