HTML   Lekcja 3.4   - Formularze - kontynuacja


Elementy kontrolne - część druga.


P O L A   T E K S T O W E   -   TEXT INPUTS - służą do wpisywania informacji,

Dostępne są trzy typy elementów kontrolnych pozwalające na wprowadzenie tekstu:

1. Tworzony za pomocą znacznika <INPUT> z atrybutem type=text Pozwala on na stworzenie pojedynczego okienka o wysokości jednej lini tekstu. Należy przy tym pamiętać, że input nie jest znacznikiem blokowym, tzn. występuje bez znacznika zamykającego.
Atrybut SIZE decyduje o długości pola, a atrybut MAXLENGTH ogranicza długość przyjmowanego tekstu, VALUE inicjuje wpis.
Przykład:
Proszę coś wpisać:     

<input type="text" name="tekst1" size="25" maxlength="20">
<input type="text" name="tekst2" size="15" value='hej!">
 
2. Jeżeli znacznik <INPUT> wyposażymy w atrybut  type=password wówczas wpisywana informacja nie będzie pokazywana w polu elementu w formie jawnej lecz poszczególne litery będą zastępowane gwiazdkami.
Przykład (z użyciem metody post):

Hasło:            <input type="password" name="tekst1" size="20">
 
Formularz wysyłający PASSWORD powinien stosować metodę post
<form name="fp" action="getform6.php" method="post"> ,

Przykład: (z użyciem metody get) - nie powinien być naśladowany

Hasło:      
<input type="password" name="tekst1" size="20">

Jeśli formularz znajdzie się na pojedyńczej stronie w głównym oknie przegladarki, zastosowana metoda get umożliwi postronnym osobom odczytanie hasła w ukazującym się w okienku przeglądarki adresie i na pasku stanu. Możliwe jest także zapisanie go razem z adresem strony w bookmarks czyli ulubionych. Nasza witryna wykorzystuje system wieloramkowy i adresy stron podrzędnych są widoczne tylko na pasku stanu.

  3. Tworzony za pomocą znacznika <TEXTAREA>, wyświetla okno, w które można wpisywać wiele lini tekstu. Znacznik posiada atrybuty pozwalające na ustawienie wielkości pola tekstowego. Są to: ROWS wstawiające potrzebną ilość wierszy oraz
COLS odpowiednią ilość kolumn pola.

Znacznik <textarea> jest znacznikiem blokowym, tzn. działa łącznie ze znacznikiem zamykającym </textarea>.
Pomiędzy te znaczniki można wstawić treść inicjującą, (domyślną), która może być usunięta lub nie, przez użytkownika. Nie powinna ona zawierać znaczników HTML. Treść wpisana przez użytkownika może natomiast je zawierać.
Przykład:
   
<textarea name="tekst1" cols=30 rows=5></textarea>
<textarea name="tekst2" cols=15 rows=5>hej !</textarea>

   
W obu przypadkach wprowadzony tekst staje się informacją jaką formularz przekazuje razem z wartością name elementu kontrolnego.

 
P O L A    U K R Y T E     -     HIDDEN CONTROLS - ukryte elementy kontrolne

Przekazują one również informację tekstową, ale nie jest ona wprowadzana przez użytkownika. Informacja ta jest albo z góry wcześniej wpisana przez projektanta formularza, albo w trakcie sesji oglądania strony WWW zostaje wpisana przez skrypt. Pola ukryte wykonuje się za pomocą znacznika <input> z atrybutem type="hidden".

Przykład:
tutaj znajdują się niewidoczne pola tekstowe.

<input type="hidden" name="tekst1" value="Informacja ta pochodzi z formularza z lekcji 3.4. - HTML On-Line portalu Teaching Polish">

<input type="hidden" name="tekst2" value="">

Ukryte elementy kontrolne są niezwykle pożyteczne i spełniają wiele funkcji. MIędzy innymi mogą one:
- dostarczać informacji o dokumencie z którego pochodzą,
- dostarczać informacji o sposobie obróbki formularza,
- precyzować sposób i formę graficzną odpowiedzi na formularz, - przechowywać istotne dane, pozwalając na ich transfer z jednego formularza do drugiego.

 
P O L E    S E L E K C J I     P L I K U     -     FILE SELECT - selekcja i wysyłanie pliku.

Realizowany jest za pomocą znacznika <input> z atrybutem type="file". Pozwala na wybór pliku znajdującego się w komputerze użytkownika lub sieci lokalnej, jeśli komputer ten jest do niej podłączony. Plik jest nastepnie wysyłany razem z pozostałą zawartością formularza. Atrybut value inicjujący nazwę pliku, oraz atrybut accept mający podać akceptowane do wysyłki typy plików sa przez przeglądarki ignorowane.

Aby formularz posiadający elementy wysyłające pliki mógł funkcjonować prawidłowo musi on posiadać znacznik otwierający <form> wyposażony w odpowiednie wartości atrybutów, a mianowicie METHOD=post i ENCTYPE="multipart/form-data".
Zawartość formularzy zawierająca tego typu dane jest kierowana na serwer do odpowiednich programów CGI lub jest obsługivana przez ASP lub PHP.

Przykład:

       

<form method=post action="getfile.php" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="30000" />
<input type=file name="userfile" accept="image/jpg">    
<input type="reset" value="anuluj">    
<input type="hidden" name="etykieta" value="t15">
<input type="submit" value="wyślij">
</form>


Przykłady:

narodowość:  
<input type=text name="nationality" size="10" maxlength="10' value="polska">

imię:  
<input type=text name="first_name" size="10" maxlength="10' value="">

hasło:  
<input type=password name="A2" size="10" maxlength="10' value="">

lubię psy
<input type=checkbox name="A3" checked> value="lubi psy"
lubię koty
<input type=checkbox name="A4"> value="lubi koty"

jestem kobietą
<input type=radio name="A5" value="kobieta">
jestem mężczyzną
<input type=radio name="A5" value="mężczyzna">

Wysyłam plik:
<input type=file name="HTML">

Tutaj jest niewidoczny input, <input type=hidden name=informacja1 value="Jakaś informacja do przesłania">
który moze zawierać informacje. Treść tej informacji może być modyfikowana przez skrypt.


  <input type="button" value="resetuj">

  <input type="reset" value="resetuj">

  <input type="submit" value="wyślij">  
Przyciski można wykonac jako input lub button element.

<input> posiada atrybut TYPE=[ text | password | checkbox | radio | submit | reset | file | hidden | image | button ] do wyboru, oraz atrybuty NAME, SIZE, MAXLENGTH i VALUE. - podające odpowiednio: identyfikator, wielkość pola danych, maksymalną ilość znaków do wpisania i ewentualną wcześniej wpisaną wartość.

[dalej]