foto1
foto1
foto1
foto1
foto1
1
1

STRUKTURA FORMULARZA

<form action="*">
Pola formularza
</form>

* - adres e-mail, ścieżka dostępu do skryptu

WYSYŁANIE POCZTY

Aby wysłać wiadomość ze strony w poleceniu action należy podać adres e-mail oraz określić metodę:

  • method="post" (wysyłamy)
  • method="get" (pobieramy)
Przykład
<form action="mailto:Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript." method="post">
Pola formularza
</form>

RODZAJE PÓL FORMULARZA

POLE TEKSTOWE

Pole tekstowe określamy za pomocą input.

<form action="*">
<label>Nazwisko</label> <input type="text" name="nazwisko" />
</form>
Przykład 
  • type - typ pola
  • name - nazwa powinna być inna dla każdego pola

Formatowanie pola tekstowego.

<form action="*">
<label>Nazwisko</label> <input type="text" name="nazwisko" size="50" maxlength"30" />
</form>
  • size - rozmiar pola
  • maxlength - maksymalna ilość znaków
Przykład 

POLE OPCJI

Pole opcji ustalamy za pomocą typu radio.

<form action="*">
<input type="radio" name="radio" value="wartość" />
</form>
  • type - typ pola
  • name - nazwa powinna być inna dla każdego pola
  • value - wartość inna dla każdej odpowiedzi

Przycisk typu radio umożliwia zaznaczenie jednej opcji.

Przykład A  B  C

POLE WYBORU

Pole wyboru ustalamy za pomocą typu checkbox.

<form action="*">
<input type="checkbox" name="checkbox" value="wartość" />
</form>
  • type - typ pola
  • name - nazwa powinna być inna dla każdego pola
  • value - wartość inna dla każdej odpowiedzi

Przycisk typu checkbox umożliwia zaznaczenie wielu opcji.

Przykład A  B  C

OBSZAR TEKSTOWY

Obszar tekstowy ustalamy za pomocą text-area.

<form action="*">
<textarea name="texarea"></textarea>
</form>
Przykład

LISTA WYBORU

Listę wyboru ustalamy za pomocą select.

  • Lista rozwijana
<form action="*">
<select name="select">
<option>Opcja</option>
</select>
</form>
Przykład
  • Lista z możliwością zaznaczenia kilku opcji
<form action="*">
<select name="multiple" multiple="multiple">
<option>Opcja</option>
</select>
</form>
Przykład

HASŁO

Hasło ustalamy za pomocą typu password.

<form action="*">
<label>Hasło</label> <input type="password" name="haslo" />
</form>
Przykład 

WYSYŁANIE

Wysyłanie ustalamy za pomocą typu submit.

<form action="*">
<input type="submit" value="Wyślij" />
</form>
Przykład

CZYSZCZENIE ZAWARTOŚCI

Czyszczenie zawartości ustalamy za pomocą typu reset.

<form action="*">
<input type="reset" value="Wyczyść formularz" />
</form>
Przykład
Nazwisko 

 A
 B
 C

PRZYCISK

Przycisk ustalamy za pomocą button. W odróżnieniu od dwóch powyższych sposobów daje więcej możliwości sformatowania jego wyglądu.

<form action="*">
<button type="typ"></button>
</form>

Typy przycisku:

  • button - domyślny
  • submit - wysyłanie
  • reset - kasowanie
<form action="*">
<button type="submit">Wyślij formularz</button>
</form>
Przykład

Poniżej przykład przycisku obrazkowego.

<form action="*">
<button type="submit"><img src="/sciezka_dostepu_do_obrazka" alt="wyślij" /></button>
</form>