Формы и HTML5 / Паттерны значений полей [17/28]

Курсы §21. Формы, часть 2
1

`

Паттерны значений полей Форма личных данных Заявление на получение визы Номер котопаспорта
`

Формы и HTML5 / Паттерны значений полей 17/28

Чего не проходит задание???

2

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

1 лайк
3

Дабы не дублировать темы, прошу помощи здесь.
Подскажите пожалуйста где ошибка:

<!DOCTYPE html>
<html>
    <head>
       <title>Паттерны значений полей</title>
       <meta charset="utf-8">
       <link rel="stylesheet" href="/assets/course74/keksik-style.css">
    </head>
    <body>
        <header class="page-header">Форма личных данных</header>
        <main>
            <form action="/echo" method="post">
                <fieldset>
                    <legend>Заявление на получение визы</legend>
                    <label for="passport">Номер котопаспорта</label> 
    			    <input type="text" name="passport" pattern="[0-9]{3}-[0-9]{5}">
        		</fieldset>
        		<div class="buttons">
    				<input type="submit" value="Оформить">
    			</div>
		    </form> 
        </main>
        <footer class="page-footer"></footer>
    </body>
</html>
4

Ваше поле для ввода номера паспорта должно быть обязательным для заполнения. Добавьте ему атрибут required.

1 лайк
5

Спасибо, все заработало

6

Какое значение нужно ввести, чтобы запрос был отправлен на сервер? “Валидное”

7

Добрый день,
Почему в стилях два раза прописываются значения для input? При объединении в один стиль ничего не поломалось)

        <form action="/echo" method="post">
            <fieldset>
                <legend>Заявление на получение визы</legend>
                <label for="passport">Номер котопаспорта</label>
                <input type="text" id="passport" name="passport" pattern="[0-9]{3}-[0-9]{5}" value="322-22332" required>
                <label for="tel">Номер телефона</label>
                <input type="tel" name="tel" required pattern="[0-9]{1}-[0-9]{3}-[0-9]{3}">
            </fieldset>
            <div class="buttons">
                <input type="submit" value="Оформить">
            </div>
        </form>

form {
width: 300px;
margin: 0 auto;
padding: 20px;
background-color: #ffffff;
border-radius: 10px;
box-shadow: 0 0 10px #cccccc;
}

fieldset {
padding: 10px;
border: 1px solid #34495e;
border-radius: 5px;
}

fieldset legend {
color: #34495e;
}

label {
display: block;
margin-bottom: 5px;
}

input {
width: 95%;
height: 24px;
margin-bottom: 10px;
}

input {
padding: 2px 5px;
font-family: “Roboto”, sans-serif;
border: 1px solid #cccccc;
border-radius: 5px;
vertical-align: middle;
}

input[type=“submit”] {
display: inline-block;
width: auto;
height: auto;
margin: 0 5px;
padding: 6px 15px;
color: #ffffff;
background: #2c3e50;
border: none;
border-radius: 5px;
}

.buttons {
margin-top: 10px;
text-align: center;
}

main {
min-height: 400px;
}

8

Наша недоработка, исправим при обновлении курса, спасибо.

9

ещё вопрос) другой
получается, что label может быть и тегом, и атрибутом?

10

Почему вы так решили?

11 
                    <div class="two-third-width">
                    <label for="food">Любимая еда</label> 
                    <select id="food" name="food[]" multiple>
                    <optgroup label="Еда">
                        <option value="meat">Мясо</option>
                        <option value="fish">Рыба</option>
                        <option value="chi">Курочка</option>
                        <option value="ind">Индейка</option>
                        <option value="mice">Мыши</option>
                         <option value="smet">Сметана</option>
                    </optgroup> 
                    <optgroup label="Напитки">
                        <option value="milk">Молоко</option>
                        <option value="kef">Кефир</option>
                        <option value="water">Вода</option>
                    </optgroup>
                    </select>
                </div>
12

Любимая еда
.
.

13

Любимая еда

14

Да, вижу. Вы правы, как название для группы option может выступать атрибутом.

15

наверное, стоит воспринимать это как два вида одного и того же:
label …
и
optgroup label
просто пока для меня со странной логикой в записи

16

Паттерны значений полей

<fieldset>
       <legend>Заявление на получение визы</legend>
       <label for="passport">Номер котопаспорта</label>
       <input type="text" name="passport" pattern="[0-9]{3}-[0-9]{5}" required>
</fieldset>

В этом задании нас просят указать атрибут name со значением passport, но ни слова про id="passport" для связки с label (по умолчанию он тоже указан не был). Это считается правильным, id необязателен там?