HTML Атрибути Input форми
У цьому розділі описано різні атрибути form* для HTML елемента <input>.
Атрибут form
Атрибут input form визначає форму, якій належить елемент <input>.
Значення цього атрибута має відповідати атрибуту id в елементі <form>, якому він належить.
Приклад
Поле введення, розташоване за межами HTML форми (але все ще є частиною форми):
<form action="/action_page.html" id="form1">
<label for="fname">Ім’я:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
</form>
<label for="lname">Прізвище:</label>
<input type="text" id="lname" name="lname" form="form1">
Спробуйте самі »
Атрибут formaction
Атрибут input formaction визначає URL-адресу файлу, який оброблятиме введені дані під час надсилання форми.
Примітка: Цей атрибут замінює атрибут action елемента <form>.
Атрибут formaction працює з такими типами введення: submit та image.
Приклад
HTML форма із двома кнопками надсилання з різними діями:
<form action="/action_page.html">
<label for="fname">Ім’я:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Прізвище:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Відправити">
<input type="submit" formaction="/action_page2.html" value="Віддправити як адмін">
</form>
Спробуйте самі »
Атрибут formenctype
Атрибут input formenctype вказує, як дані форми мають бути закодовані під час надсилання (тільки для форм з method="post").
Примітка: Цей атрибут замінює атрибут enctype елемента <form>.
Атрибут formenctype працює з такими типами введення: submit та image.
Приклад
Форма з двома кнопками надсилання. Перша надсилає дані форми з кодуванням за замовчуванням, друга надсилає дані форми, закодовані як "multipart/form-data":
<form action="/action_page_binary.asp" method="post">
<label for="fname">Ім’я:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formenctype="multipart/form-data"
value="Submit as Multipart/form-data">
</form>
Спробуйте самі »
Атрибут formmethod
Атрибут input formmethod визначає метод HTTP для надсилання даних форми на URL-адресу дії.
Примітка: Цей атрибут замінює атрибут method елемента <form>.
Атрибут formmethod працює з такими типами введення: submit та image.
Дані форми можна надіслати як змінні URL-адреси (method="get") або як трансакцію HTTP повідомлення (method="post").
Зауваження щодо метода "get":
- Цей метод додає дані форми до URL-адреси в парах ім’я/значення
- Цей метод корисний для подання форм, коли користувач хоче додати результат у закладки
- Існує обмеження на кількість даних, які можна розмістити в URL-адресі (різняться в різних браузерах), тому ви не можете бути впевнені, що всі дані форми будуть правильно передані
- Ніколи не використовуйте "get" метод передачі конфіденційної інформації! (пароль або іншу конфіденційну інформацію буде видно в адресному рядку браузера)
Зауваження щодо метода "post":
- Цей метод надсилає дані форми як транзакцію HTTP post
- Надіслані форми за допомогою методу "post" не можна додати до закладок
- Метод "post" є більш надійним і безпечним, ніж "get", і "post" не має обмежень за розміром
Приклад
Форма з двома кнопками надсилання. Перша надсилає дані форми з method="get". Друга надсилає дані форми з method="post":
<form action="/action_page.html" method="get">
<label for="fname">Ім'я:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Прізвище:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Надіслати за допомогою GET">
<input type="submit" formmethod="post" value="Надіслати за допомогою POST">
</form>
Спробуйте самі »
Атрибут formtarget
Атрибут input formtarget визначає назву або ключове слово, яке вказує, де відображати відповідь, отриману після надсилання форми.
Примітка: Цей атрибут замінює атрибут target елемента <form>.
Атрибут formtarget працює з такими типами введення: submit та image.
Приклад
Форма з двома кнопками надсилання з різними цільовими вікнами:
<form action="/action_page.html">
<label for="fname">Ім'я:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Прізвище:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Відправити">
<input type="submit" formtarget="_blank" value="Відправити в нове вікно/вкладку">
</form>
Спробуйте самі »
Атрибут formnovalidate
Атрибут input formnovalidate вказує, що елемент <input> не слід перевіряти під час подання.
Примітка: Цей атрибут замінює атрибут novalidate елемента <form>.
Атрибут formnovalidate працює з такими типами введення: submit.
Приклад
Форма з двома кнопками відправки (з підтвердженням і без):
<form action="/action_page.html">
<label for="email">Введіть ваш email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Відправити">
<input type="submit" formnovalidate="formnovalidate"
value="Відправити без перевірки">
</form>
Спробуйте самі »
Атрибут novalidate
Атрибут novalidate є атрибутом <form>.
Якщо він присутній, novalidate вказує, що всі дані форми не повинні перевірятися під час подання.
Приклад
Вкажіть, що жодні дані форми не повинні перевірятися під час надсилання.
<form action="/action_page.html" novalidate>
<label for="email">Введіть ваш email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Відправити">
</form>
Спробуйте самі »
HTML Елементи Form та Input
| Тег | Опис |
|---|---|
| <form> | Визначає HTML-форму для введення користувачем |
| <input> | Визначає елемент керування введенням |
Для отримання повного списку всіх доступних HTML тегів відвідайте HTML Довідник тегів на нашому сайті W3Schools українською.
