HTML => Formularze

Wprowadzenie

Aby zgrupować elementy wejściowe i przesłać dane, HTML używa elementu formularza do enkapsulacji elementów wejściowych i przesyłania. Te formularze obsługują wysyłanie danych określoną metodą na stronę obsługiwaną przez serwer lub moduł obsługi. W tym temacie wyjaśniono i pokazano użycie formularzy HTML do gromadzenia i przesyłania danych wejściowych.

Składnia

<form method="post|get" action="somePage.php" target="_blank|_self|_parent|_top|framename">

Parametry

Atrybut	Opis
`accept-charset`	Określa kodowanie znaków, które mają być używane podczas przesyłania formularza.
`action`	Określa, gdzie wysłać dane formularza po przesłaniu formularza.
`autocomplete`	Określa, czy formularz powinien mieć autouzupełnianie włączony czy wyłączony.
`enctype`	Określa sposób kodowania danych formularza podczas przesyłania go na serwer (tylko dla metody = „post”).
`method`	Określa metodę HTTP używaną podczas wysyłania danych formularza (POST lub GET).
`name`	Określa nazwę formularza.
`novalidate`	Określa, że formularz nie powinien być sprawdzany podczas przesyłania.
`target`	Określa miejsce wyświetlania odpowiedzi otrzymanej po przesłaniu formularza.

Uwagi

Element <form> reprezentuje sekcję zawierającą elementy związane z formularzem (np. <button> <fieldset> <input> <label> <output> <select> <textarea> ), który przesyła informacje do serwera. Wymagane są zarówno początkowe ( <form> ), jak i końcowe ( </form> ) znaczniki.

Przedkładający

Atrybut akcji

Atrybut akcji określa akcję, która ma zostać wykonana po przesłaniu formularza, co zwykle prowadzi do skryptu, który zbiera przesłane informacje i współpracuje z nimi. jeśli pozostawisz to puste, wyśle to do tego samego pliku

<form action="action.php">

Atrybut metody

Atrybut metody służy do zdefiniowania metody HTTP formularza, którym jest GET lub POST.

<form action="action.php" method="get">
<form action="action.php" method="post">

Metoda GET jest najczęściej używana do uzyskiwania danych, na przykład do otrzymania posta według jego identyfikatora lub nazwy albo do wysłania zapytania do wyszukania. Metoda GET doda dane formularza do adresu URL określonego w atrybucie akcji.

www.example.com/action.php?firstname=Mickey&lastname=Mouse

Metoda POST jest używana podczas przesyłania danych do skryptu. Metoda POST nie dołącza danych formularza do adresu URL akcji, ale wysyła za pomocą treści żądania.

Aby poprawnie przesłać dane z formularza, należy podać nazwę atrybutu name.
Jako przykład wyślijmy wartość pola i ustawmy jego nazwę na nazwisko :

<input type="text" name="lastname" value="Mouse">

Więcej atrybutów

<form action="action.php" method="post" target="_blank" accept-charset="UTF-8" 
enctype="application/x-www-form-urlencoded" autocomplete="off" novalidate>

<!-- form elements -->

</form>

Atrybut docelowy w znaczniku formularza

Atrybut target określa nazwę lub słowo kluczowe, które wskazuje, gdzie wyświetlić odpowiedź otrzymaną po przesłaniu formularza.

Atrybut target określa nazwę lub słowo kluczowe kontekstu przeglądania (np. Tab, okno lub wbudowana ramka).

Z tagu z atrybutem docelowym:

<form target="_blank">

Wartości atrybutów

Wartość	Opis
_pusty	Odpowiedź zostanie wyświetlona w nowym oknie lub karcie
_samego siebie	Odpowiedź jest wyświetlana w tej samej ramce (jest to ustawienie domyślne)
_rodzic	Odpowiedź jest wyświetlana w ramce nadrzędnej
_Top	Odpowiedź jest wyświetlana w pełnej części okna
nazwa ramowa	Odpowiedź jest wyświetlana w nazwie iframe

Uwaga: Atrybut target jest przestarzały w HTML 4.01 . Atrybut target jest obsługiwany w HTML5 .
Ramki i zestawy ramek nie są obsługiwane w HTML5 , więc wartości _parent, _top i framename są teraz najczęściej używane z ramkami iframe .

Przesyłanie plików

Obrazy i pliki można przesyłać / przesyłać na serwer, ustawiając atrybut enctype znacznika form na multipart/form-data . enctype określa sposób kodowania danych formularza podczas przesyłania na serwer.

Przykład

<form method="post" enctype="multipart/form-data" action="upload.php"> 
    <input type="file" name="pic" />
    <input type="submit" value="Upload" />
</form>

Grupowanie kilku pól wprowadzania

Projektując formularz, możesz zgrupować kilka pól wejściowych w grupę, aby pomóc zorganizować układ formularza. Można to zrobić za pomocą znacznika. Oto przykład jego użycia.

Dla każdego zestawu pól możesz ustawić legendę zestawu, używając znacznika LEGENDA TEKST

Przykład

<form>
  <fieldset>
     <legend>1st field set:</legend>
     Field one:<br>
     <input type="text"><br>
     Field two:<br>
     <input type="text"><br>
  </fieldset><br>
  <fieldset>
     <legend>2nd field set:</legend>
     Field three:<br>
     <input type="text"><br>
     Field four:<br>
     <input type="text"><br>
  </fieldset><br>
  <input type="submit" value="Submit">
</form>

Wynik

Obsługa przeglądarki

Najnowsze wersje Chrome, IE, Edge, FireFox, Safari i Opera również obsługują ten tag

Modified text is an extract of the original Stack Overflow Documentation

Licencjonowany na podstawie CC BY-SA 3.0

Nie związany z Stack Overflow

HTML
Formularze

Szukaj…