Kurs html cz. 8 Formularze

Doszliśmy do ostatniej części podstawowego kursu html. Ostatnim opisywanym elementem specyfikacji html są formularze. W obecnej formie Internetu kiedy użytkownik bierze czynny udział w formułowaniu treści na stronie internetowej wykorzystanie formularzy jest niezbędne. Poprawne konstruowanie formularzy pozwala sprawnie i bezproblemowo obsłużyć dużą rzeszę użytkowników strony. 

Z formularzami spotykamy się nie tylko w Internecie ale również w życiu codziennym czy to w urzędach państwowych czy w instytucjach takich jak banki, agencje i różnego rodzaju sztuczne tworzywa ludzkiego umysłu. Wiadomo jednak, że bez formularzy zbieranie danych było by bardzo trudne gdyż zajmowało by dużo czasu. Dlatego wszystkie formularze na stronach internetowych są konstruowane w taki sposób aby każdy zwyczajny użytkownik Internetu mógł wypełnić je bez żadnych problemów. 

Konstrukcja formularza

Konstrukcja formularza nie jest zbyt skomplikowana gdyż składa się z znacznika <form></form>. W tym znaczniku musi się znajdować również atrybut action, który określa co ma zostać wykonane po kliknięciu w przycisk na końcu formularza. Kolejnym atrybutem umieszczanym w ramach tego znacznika jest method, który określa w jakiej postaci mają zostać przesłane dane jeśli będzie wykonywana operacja przy użyciu skryptów. Poniżej przedstawię przykład prostego formularza: 

Jak widać na powyższym przykładzie zbudowanie prostego formularza nie jest trudne. Przejdźmy zatem dalej. W celu wykorzystania formularza do przesyłania danych musisz jeszcze umieścić jakieś pola, w które użytkownik będzie mógł coś wpisać i wysłać za pomocą przycisku. Wyróżnić można klika pól: 

• Input – jeden wiersz do którego można wpisać krótszy element danych. I tutaj również mamy podział:

1. Text – wstawia zwykłe pole tekstowe

1. Checkbox – są to małe okienka, która można zaznaczać lub odznaczać. W tym przypadku można zaznaczyć więcej niż jedno pole tego typu

1. Radio – podobna sytuacja jak z polem checkbox, ale tutaj nie można zaznaczyć więcej niż jedno takie pole

1. Password – pole służy do wpisywania hasła. Wpisywane znaki zamieniane są na gwiazdki

1. File – pole umożliwia dołączenie pliku do formularza

1. Submit – umieszcza przycisk do formularza, który pozwoli wysłać dane po wypełnieniu formularza

1. Reset – umieszcza przycisk, który czyści wszystkie pola formularza

1. Hidden – umieszczane jest zwykłe pole tekstowe, które nie jest widoczne na stronie

1. Button – w tym przypadku umieszczany jest przycisk dowolnego przeznaczenia

W każdym z powyżej wymienionych pól należy umieścić atrybut name, który umożliwi odpowiednie skonfigurowanie danych jeśli jest wykorzystywany skrypt. Dodatkowymi atrybutami w każdym z pól (nie są obowiązkowe) jest value, który wstawia domyślną wartość w polu oraz size. Atrybut size określa ilość znaków mieszczących się w widocznej części. 

Do tego miejsca zostały omówione pola, które można deklarować za pomocą input. W budowie formularzy występują także inne typy tj: 

• Select – pole umożliwia nam wybranie pozycji z listy
• Textarea – pole do wprowadzania większej ilości danych do formularza

Grupa pól select ma następującą konstrukcje: 

Stworzenie takiej listy pozwala na zaoszczędzenie miejsca na stronie. Listy są bardzo praktyczne w przypadku kiedy robimy spis państw lub innego rodzaju spisy z wieloma elementami. 

Pole textarea jak już wspominałem służy do wpisywania dużych ilości danych do formularza. Składnia wygląda następująco: 

Jeśli nie zamierzasz odbierać dużych ilości danych to zastosuj pole typu text wraz z input. Zastosowanie textarea jest przydatne przy komentarz lub na forach gdzie ilość danych, która zostanie wprowadzona jest nie możliwa do przewidzenia przez osobę tworzącą formularz. 

Na samym końcu należy umieścić przycisk, który pozwoli na wysłanie danych do nadawcy. Taki przycisk umieszcza się przed samym końcem formularza w następujący sposób: 

Poniżej przedstawiam jak powinien wyglądać formularz: 

Podsumowanie

Podsumowując formularze można zastosować od prostego wysłania e-maila do skomplikowanych operacji związanych z programowaniem skryptów na serwerze. Dzięki formularzom użytkownicy mogą brać czynny udział w tworzeniu strony.