Formularz

  • Witam już w piątym kursie przygotowującym do Kwalifikacji E.14.  Już wiemy jak przedstawiać informacje na stronie aby były przejrzyste , teraz nauczymy się jak je wprowadzać za pomocą formularzy. 

Zapraszam.

Czym są formularze ?

Są to pola w których wpisujesz login, hasło , podajesz swój wiek i zaznaczasz czy np. nie jesteś robotem. Służą do komunikacji między tobą a witryną.

Formularze zawieramy między znacznikami <form></form>   wewnątrz których umieszczone są pola <input/> ,formularze zawierają jeszcze dwa elementy metodę (method)  i akcję jaka ma się wykonać (action) , ale więcej o tych elementach dowiesz się kursach dotyczących bezpośrednio języka PHP.

 

Wewnątrz formularzy wyróżniamy kilka typów pól :

  • text
  • password
  • number
  • radio
  • checkbox
  • submit
  • reset

 

type=”text”

Jak sama nazwa podpowiada do tego pola możemy wprowadzać tekst , ale także liczby, które będą wczytywane jako łańcuch tekstowy.

<form action=”” method=””>

<input type=”text”>

</form>

Rezultat:

 


type=”password”

Tego pola użyjemy do wprowadzania haseł, gdyż jego zawartość jest zakropkowana.

<form action=”” method=””>

<input type=”password”>

</form>

Rezultat:

 


type=”number”

W tym rodzaju pola mamy narzucony konkretny typ wprowadzania danych którym są liczby.

<form action=”” method=””>

<input type=”number”>

</form>

Rezultat:

 


type=”number”

Pola radiu użyjemy gdy będzie kilka możliwości ale wykluczających się np. wykształcenie.

<form action=”” method=””>

<input type=”radio” value=”Tak”>

<input type=”radio” value=”Nie”>

</form>

Rezultat:                 

Tak
Nie

 


type=”number”

W przeciwieństwie do poprzedniego rodzaju w checkbox można wybrać kilka wariantów, np. gdy pytamy o zainteresowania.

<form action=”” method=””>

<input type=”checkbox” value=”Sport”>

<input type=”checkbox” value=”Książki”>

</form>

Rezultat:       

 Sport
 Książki

 


type=”password”

Jest to przycisk którego użyjemy do sfinalizowania uzupełnianego przez nas formularza.

<form action=”” method=””>

<input type=”submit” value=”Wyślij”>

</form>

Rezultat:

 


type=”password”

Tego przycisku użyjemy do wyczyszczenia naszego formularza z wcześniej wprowadzonych wartości.

<form action=”” method=””>

<input type=”reset” “>

</form>

 Rezultat:          

 

2/3

Dodaj komentarz