Atrybuty formularza input HTML

Polecane kursy: <input> Rozdział ten przedstawia HTML Różne elementy form* Atrybuty.

Atrybut form

Atrybut input form Atrybut określa <input> Formularz, do którego należy element.

Wartość tego atrybutu musi być równa atrybutowi id elementu <form> do którego należy.

Przykład

Pole wejściowe znajdujące się poza HTML formularzem (ale nadal jest częścią formularza):

<form action="/action_page.php" id="form1">
  <label for="fname">Nazwisko:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Zatwierdź">
</form>
<label for="lname">Imię:</label>
<input type="text" id="lname" name="lname" form="form1">

Spróbuj sam!

Atrybut formaction

Atrybut input formaction Atrybut określa URL pliku, który przetwarza dane wejściowe (dane) podczas wysyłania formularza.

Komentarz:Ten atrybut nadpisuje <form> Atrybut elementu action Atrybuty.

formaction Atrybut dotyczy następujących typów wejścia: submit i image.

Przykład

HTML formularz z dwoma przyciskami submit, które mają różne operacje (action):

<form action="/action_page.php">
  <label for="fname">Nazwisko:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Imię:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Zatwierdź">
  <input type="submit" formaction="/action_page2.php" value="Wysyłaj jako administrator">
</form>

Spróbuj sam!

Atrybut formenctype

Atrybut input formenctype Atrybut określa, jak dane formularza powinny być kodowane przy wysyłaniu (aplikuje się tylko do formularzy z method="post").

Komentarz:Ten atrybut zastąpi <form> Atrybut enctype elementu.

formenctype Atrybut dotyczy następujących typów wejścia: submit i image.

Przykład

Formularz z dwoma przyciskami submit. Pierwszy wysyła dane formularza z domyślnym kodowaniem, drugi wysyła dane formularza z kodowaniem "multipart/form-data":

<form action="/action_page_binary.asp" method="post">
  <label for="fname">Imię:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Zatwierdź">
  <input type="submit" formenctype="multipart/form-data"
  value="Wysyłaj z kodowaniem Multipart/form-data">
</form>

Spróbuj sam!

Atrybut formmethod

Atrybut input formmethod Atrybut definiuje HTTP metodę wysyłania danych formularza do URL akcji.

Komentarz:Ten atrybut zastąpi <form> Atrybut method elementu.

formmethod Atrybut dotyczy następujących typów wejścia: submit i image.

Dane formularza można wysłać jako zmienne URL (method="get") lub jako transakcję HTTP POST (method="post")

Uwagi dotyczące GET:

  • Dodaj dane formularza w formie pary nazwa/wartość do URL
  • Nigdy nie używaj GET do wysyłania wrażliwych danych! (Wysyłane dane formularza będą widoczne w URL)
  • Długość URL jest ograniczona (2048 znaków)
  • Dobrze nadaje się do formularzy, w których użytkownik chce dodać wyniki jako zakładkę
  • GET jest odpowiedni dla niesekretnej danych, takich jak ciąg zapytań w Google

Uwagi dotyczące POST:

  • Dodaj dane formularza do ciała żądania HTTP (dane wysyłane formularza nie będą widoczne w URL)
  • POST nie ma ograniczeń dotyczących rozmiaru, można go używać do wysyłania dużej ilości danych.
  • Przyciski submit z POST nie mogą być dodane jako zakładki

Wskazówka:Jeśli dane formularza zawierają wrażliwe informacje lub dane osobowe, koniecznie użyj POST!

Przykład

Formularz z dwoma przyciskami submit. Pierwszy wysyła dane formularza za pomocą method="get", drugi używa method="post" do wysyłania danych formularza:

<form action="/action_page.php" method="get">
  <label for="fname">Nazwisko:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Imię:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Wyślij za pomocą GET">
  <input type="submit" formmethod="post" value="Wyślij za pomocą POST">
</form>

Spróbuj sam!

Atrybut formtarget

Atrybut input formtarget Atrybut określa nazwę lub klucz, który określa, gdzie zostanie wyświetlona odpowiedź po wysłaniu formularza.

Komentarz:Ten atrybut zastąpi <form> atrybutu target elementu.

formtarget Atrybut dotyczy następujących typów wejścia: submit i image.

Przykład

Formularz z dwoma przyciskami submit i różnymi oknami docelowymi:

<form action="/action_page.php">
  <label for="fname">Nazwisko:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Imię:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Zatwierdź">
  <input type="submit" formtarget="_blank" value="Wyślij do nowego okna/ zakładki">
</form>

Spróbuj sam!

formnovalidate

Atrybut input formnovalidate Atrybut określa, że nie powinno się weryfikować elementu <input> podczas wysyłania.

Komentarz:Ten atrybut zastąpi <form> Atrybut novalidate elementu.

formnovalidate Atrybut jest dostępny dla następujących typów wejścia: submit.

Przykład

Formularz z dwoma przyciskami submit (z weryfikacją i bez weryfikacji):

<form action="/action_page.php">
  <label for="email">Wprowadź swój adres e-mail:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Zatwierdź">
  <input type="submit" formnovalidate="formnovalidate"
  value="Zatwierdź bez weryfikacji">
</form>

Spróbuj sam!

Atrybut novalidate

novalidate Atrybut to <form> Atrybuty.

Jeśli ustawiona, atrybut novalidate określa, że podczas wysyłania nie powinno być weryfikowane wszystkich danych formularza.

Przykład

Określa, że w momencie wysyłania nie powinno być weryfikowane żadnych danych formularza:

<form action="/action_page.php" novalidate>
  <label for="email">Wprowadź swój adres e-mail:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Zatwierdź">
</form>

Spróbuj sam!

Elementy Formularza i Input HTML

Tag Opis
<form> Definiowanie HTML formularza dla użytkownika wejścia.
<input> Definiowanie kontrolki wejściowej.

Aby uzyskać pełną listę dostępnych tagów HTML, odwiedź nasz Przeglądarka tagów HTML.