Przejdź do treści

Wysłanie formularza <input "submit, image">

Jak wysłać formularz?

Przycisk tekstowy <input "submit">

<form action="...">
	<input type="submit" value="wartość">
</form>
gdzie jako "wartość" należy wpisać napis, który pojawi się na przycisku wysyłania formularza. Jeśli opuścimy ten parametr, pojawi się tam domyślny tekst, np.: "Prześlij kwerendę".

Polecenie wprowadza na ekran przycisk z tekstem, po naciśnięciu którego, nastąpi wysłanie formularza.

Formularz może posiadać więcej niż jeden przycisk wysyłania danych. Istnieje możliwość, aby każdy z nich przesyłał informacje pod inny adres: HTML5 / Nadpisanie atrybutów formularza.

Wygląd pól formularza można zdefiniować bardziej precyzyjnie dzięki możliwościom CSS - np. przy pomocy zamieszczonego generatora.przycisk o

Przykład <input "submit">

value="Kliknij tutaj!"

To jest przykład bez podania wartości value="...".

Blokada pola

<form action="...">
	<input type="submit" value="wartość" disabled>
</form>

Wstawienie atrybutu disabled powoduje zablokowanie pola.

Przykład <input "submit" disabled>

To pole jest zablokowane (disabled).

Przycisk obrazkowy <input "image">

<form action="...">
	<input type="image" src="ścieżka dostępu do obrazka" alt="informacja alternatywna">
</form>
gdzie jako "ścieżka dostępu do obrazka" należy podać lokalizację na dysku, gdzie znajduje się obrazek, który ma zostać wyświetlony jako przycisk wysłania formularza.
Natomiast zamiast "informacja alternatywna" można podać treść informacji, która powinna pojawić się w przypadku, gdy obrazek nie zostanie wyświetlony, a także po wskazaniu go myszką (atrybut ten nie jest konieczny).

Polecenie wprowadza na ekran przycisk w postaci obrazka, po naciśnięciu którego, nastąpi wysłanie formularza. Atrybut alt="..." pozwala podać tekst, który będzie wyświetlony zamiast przycisku w przeglądarkach tekstowych, a także jeśli użytkownik wyłączy w swojej przeglądarce wyświetlanie obrazów.

W języku HTML5 możliwe jest również podanie rozmiarów przycisku obrazkowego: width="..." height="...".

Przykład <input "image">

Możesz kliknąć poniższy obrazek, aby wysłać formularz:

Nazwa przycisku wysłania formularza <input "submit" name>

Pole wysłania formularza posiada ciekawą własność. Mianowicie jeżeli nadamy mu atrybut name="nazwa", wtedy jego wartość zostanie wysłana wraz z formularzem, tak jak to się dzieje w przypadku zwykłych pól przechowujących wpisywane przez użytkownika dane. Nowość polega jednak na tym, że w jednym formularzu może się znajdować kilka różnych pól wysyłających, każde z nich może mieć inną nazwę lub/i wartość, a z formularzem jest wysyłana wartość tylko tego, za pomocą którego został on wysłany - tzn. tego, który został kliknięty. Dzięki temu w niektórych przypadkach prostych formularzy nie trzeba wstawiać dodatkowych pól typu RADIO, a wystarczy umieścić po prostu kilka różnych przycisków wysyłających.
Nie dotyczy to alternatywnego sposobu wysyłania formularzy - wtedy trzeba stosować metody konwencjonalne.

Przykład <input "submit" name>

<form action="mailto:e-mail" method="post">
<input type="submit" name="opcja" value="Opcja 1">
<input type="submit" name="opcja" value="Opcja 2">
<input type="submit" name="opcja" value="Opcja 3">
</form>

Z takim formularzem zostanie wysłana tylko jedna z wartości:

  • opcja=Opcja 1
  • opcja=Opcja 2
  • opcja=Opcja 3

w zależności od tego, który przycisk wciśnie użytkownik. Zatem będzie to równoznaczne z następującym konwencjonalnym formularzem:

<form action="mailto:e-mail" method="post">
<input type="radio" name="opcja" value="Opcja 1">
<input type="radio" name="opcja" value="Opcja 2">
<input type="radio" name="opcja" value="Opcja 3">
<input type="submit" value="wyślij">
</form>

W skryptach np. PHP własność tą często wykorzystuje się do potwierdzania decyzji użytkownika:

<form action="?akcja=kasowanie" method="post">
<input type="hidden" name="id" value="1">
<p>Czy na pewno chcesz to zrobić?</p>
<input type="submit" name="potwierdzenie" value="Tak">
<input type="submit" name="potwierdzenie" value="Nie">
</form>

Pytania i odpowiedzi <input "submit">

Jak wysłać formularz HTML?

Domyślnie formularz jest wysyłany, jeśli użytkownik wciśnie Enter wpisując coś w dowolnym polu tekstowym albo polu hasła, które się w nim znajdują. Jednak mniej doświadczeni użytkownicy mogą nie znać tego zachowania. Poza tym w formularzu może nie być żadnego pola tego typu. Dlatego zwykle umieszcza się w nim dodatkowy przycisk, którego wciśnięcie wysyła formularz.

Przeglądarki


Chrome
Firefox
Edge
Opera
Safari
<input type="submit">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<input type="image">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Komentarze

Zobacz więcej komentarzy

Facebook