Цвет незаполненной строки

@Ivan_rok · Регистрация: 17.09.2021

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

как заставить данную строку светиться красным если ее не заполнили ?

HTML5
1
2
3
4
<div class="formcont">
                <div class="index__block__brown">Инвертарный номер:</div>
                <input class="index__block__input" type="text" name="inv_number" maxlength="20">
            </div>

@amr-now · 18.09.2021, 05:49

Здравствуйте.
Сильно зависит от используемого фреймворка.
В jQuery так:

PHP/HTML
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
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.3/dist/jquery.validate.min.js"></script>
    <style>
        .error {
            border-color: red;
            color: red;
        }
    </style>
</head>
<body>
    <form>
        <div class="formcont">
            <div class="index__block__brown">Инвертарный номер:</div>
            <input class="index__block__input" type="text" name="inv_number" maxlength="20">
        </div>
        <div>
            <button type="submit">Отправить</button>
        </div>
    </form>
    <script>
        $("form").validate({
            errorClass: "error", // CSS-класс ошибки. По умолчанию error
            errorPlacement(error, element) { // Отменить надпись об ошибке
                return false;
            },
            rules: {
                inv_number: {
                    required: true
                }
            },
            submitHandler: function (form) {
                console.log("submit"); // Тестируем, что отправка работает
                // form.submit(); // Если нужно потом действительно отправить
            }
        });
    </script>
</body>
</html>

@Ivan_rok · 18.09.2021, 13:25 **[ТС]**

а если строк несколько то просто к

HTML5
1
2
3
4
<div class="formcont">
            <div class="index__block__brown">Инвертарный номер:</div>
            <input class="index__block__input" type="text" name="inv_number" maxlength="20">
        </div>

добавляются эти строки

Добавлено через 5 минут

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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<html>
<head>
<link rel='stylesheet' href='style.css'>
<meta charset='utf-8'>
<title></title>
 
</head>
 
<body>
 
<div class='page'>
    <div class='header'></div><!-- header -->
    
                <nav>
  <ul class="topmenu">
     <li><a href="https://www.cyberforum.ru/index.php">Главная</a></li>
    <li><a href="" class="">Основные средства</a>
      <ul class="submenu">
        <li><a href="mainf.php">Компьютеры</a></li>
        <li><a href="printer.php">Принтеры</a></li>
        <li><a href="video.php">Видеонаблюдение</a></li>
        <li><a href="server.php">Сервер</a></li>
      </ul>
    </li>
    </li>
    <li><a href="" class="">Материалы</a>
      
    </li>
    <li><a href="">Учёт ПО</a></li>
  </ul>
</nav><!-- menu -->
<div class='content'>
    
    <div class='content_computers'>
    
        <form action="save_file.php" method="post" >
            
            
            <div class="formcont">
                <div class="index__block__brown">Line 1:</div>
                <input class="index__block__input" type="text" name="line_1">
            </div>
            <div class="formcont">
                <div class="index__block__brown">Line 2:</div>
                <input class="index__block__input" type="text" name="line_2">
            </div>
            <div class="formcont">
                <div class="index__block__brown">Инвертарный номер:</div>
                <input class="index__block__input" type="text" name="inv_number" maxlength="20">
            </div>
            <div class="formcont">
                <div class="index__block__brown">Год выпуска:</div>
                <input class="index__block__input" type="date" name="y_vipusk">
            </div>
            <div class="formcont">
                <div class="index__block__brown">Спецификация:</div>
                <input class="index__block__input" type="text" name="specifika">
            </div>
            <div class="formcont">
                <div class="index__block__brown">№ кабинета:</div>
                <input class="index__block__input" type="text" name="cab_number">
            </div>
            <div class="formcont">
                <div class="index__block__brown">ФИО пользователя:</div>
                <input class="index__block__input" type="text" name="fio">
            </div>
            
            
            <div class="index__block__blue">
                <div><input type="submit" class="buttons" value="Отправить запрос"></div>
                <div><input type="reset" class="buttons" value="Очистить"></div>
            </div>
            
            
        </form>
    </div>  
        
        
        
        <form action="view_file.php" method="post">
            <div class="">
                <input type="submit" class="buttons" value="Посмотреть сохраненные данные">
            </div>
        </form>
        
        <form action="del_file.php" method="post">
            <div class="">
                <input type="submit" class="buttons" value="Удаление сохраненных данных">
            </div>
        </form>
        
        <form action="upd_file.php" method="post">
            <div class="">
                <input type="submit" class="buttons" value="Обновление сохраненных данных">
            </div>
        </form>
        
    
    </div><!-- content -->
    
    <div class='footer'></div><!-- footer -->
</div>
</body>
 
</html>

Где фио и Инвентарный номер должны гореть красным при их не вводе

Новые блоги и статьи Все статьи Все блоги /
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .

Цвет незаполненной строки

Решение