2010-01-04 13:42:17

Formularze na stronie www

Formularz na stronie www jest bardzo użytecznym narzędziem zwiększającym interakcje z użytkownikiem. Formularze mogą służyć do wysyłania wiadomości, zbierania informacji o odwiedzających stronę, składania zamówień, przesyłania parametrów do skryptów itp.

<form action="form.php" method="post">
	<div>
		Miejsce na pola formularza
	</div>
</form>

Formularz jest wstawiany za pomocą znaczników „<form></form>”. Najczęściej podajemy w nich dwa parametry: action – adres skryptu przetwarzającego dane z formularza oraz method – metodę wysyłania danych. W powyższym przykładzie przetwarzaniem danych z formularza zajmie się skrypt umieszczony w pliku form.php, a dane wysłane zostaną metodą POST.

Istnieją dwie metody wysyłania formularzy: GET i POST. Przy użytej metodzie GET dane wysyłane do skryptu dołączane są do adresu URI (ang. Uniform Resource Identifier – Ujednolicony Identyfikator Zasobów) np. www.serwan.pl/form.php?zmienna=wartosc. W takim adresie bardzo łatwo można zmienić nie tylko wartość zmiennej, ale również jej nazwę. W niektórych przypadkach może to spowodować niechciane przez twórcę lub właściciela strony rezultaty. Dane GET pozostają w historii przeglądarki. Z tego względu nie należy przekazywać tą metodą danych poufnych np. numerów kart kredytowych. Przesyłanie danych metodą GET jest też ograniczone limitem długości URI, który w przeglądarce Internet Explorer wynosi 2048, a może być też obcinany na różnych urządzeniach pośredniczących.

Dużo bezpieczniejsze jest używanie metody POST. W tej metodzie dane przesyłane są w protokole HTTP, co ogranicza możliwość ich podejrzenia i zmodyfikowania. Nie ma też limitu wielkości dla tych danych.

Kontrolki formularzy nie powinny być umieszczane bezpośrednio pomiędzy znacznikami „<form></form>”. Powinno się to robić wewnątrz dodatkowych znaczników np. bloku div lub tabeli.

<form action="form.php" method="post">
	<div>
		Imię: 
		<input type="text" name="imie" />
		Hasło: 
		<input type="password" name="haslo" />
		Akceptuję regulamin: 
		<input type="checkbox" name="akcept" value="q" checked=checked/>
		Kobieta: 
		<input type="radio" name="plec" value="kobieta" />
		Mężczyzna: 
		<input type="radio" name="plec" value="mezczyzna" />
		Rok urodzenia: 
		<select name="rok">
			<option>1998</option>
			<option>1997</option>
			(...)
		</select>
		Zainteresowania: 
		<select name="zainteresowania[]" multiple="multiple">
			<option value=1”>Pływanie</option>
			<option value=2”>Muzyka</option>
			(...)
		</select>
		<textarea name="komentarz">Wpisz komentarz </textarea>
		<input type="hidden" name="nr" value="354634" />
		<input type="submit" value="wyślij" />
	</div>
</form>

Większość kontrolek formularza to pola „input”. Ich rola i funkcje są zróżnicowane w zależności od atrybutu „type”. Wartości z tych pól będą dostępne w skrypcie php poprzez nazwy – atrybut „name”. Wartości pól mogą być określone w atrybutach „value”. Domyślną wartością atrybutu „type” jest „text”. Pola tego typu pozwalają na wprowadzenie krótkiej informacji tekstowej w pojedynczej linii. Jeżeli chcemy, by pole zawierało od razu jakiś tekst, należy umieścić go w atrybucie „value”. Do wpisywania haseł przeznaczony jest typ „password”. Od typu „text” różni go jedynie maskowanie wpisywanych znaków kropkami. Pole typu „checkbox” jest polem wyboru mającym postać małego kwadratu do zaznaczania i odznaczania myszką. Po wysłaniu formularza z zaznaczonym polem „checkbox” w skrypcie pod nazwą z atrybutu „name” tego pola dostępna będzie wartość z atrybutu „value” lub 1, jeżeli „value” nie zdefiniowano. Aby umieścić w formularzu zaznaczone pole „checkbox” należy dodać atrybut „checked” o wartości „checked”.

Pola opcji czyli przełączniki w formie kółek do zaznaczania (zaznaczenie jednego automatycznie odznacza inne) uzyskujemy stosując typ „radio”. Pola tego typu są grupowane ze sobą dzięki identycznej wartości atrybutu „name”. Tylko jedno pole o takim samym atrybucie „name” może być zaznaczone. W skrypcie php dostępna będzie wartość właśnie z tego zaznaczonego pola. Typ „hidden” pozwala dołączyć do formularza dane nie wprowadzane przez osobę wypełniającą formularz, a wygenerowane na stronie. Możemy w ten sposób dołączać informacje o stronie, z której dana osoba weszła, stronie na której został wypełniony formularz (jeżeli mamy kilka identycznych formularzy na różnych stronach takie informacje mogą okazać się bardzo przydatne), informacje o ustawieniach i personalizacji strony itp.

Ostatni typ pola input, który opiszę jest przyciskiem wysyłającym formularz. Typem tym jest „submit”. Poza wyglądem charakterystyczną jego cechą jest to, że wartość atrybutu „value” jest wyświetlana jako tekst przycisku.

Poza elementami „input” w formularzu mogą znaleźć się inne kontrolki. Pole tekstowe do wpisywania wielu linii tekstu otrzymujemy dzięki znacznikom „<textarea></textarea>”. Znacznik ten posiada atrybut „name” natomiast nie posiada atrybutu „value”. Wartością wyświetlaną w formularzu i przesyłaną do skryptu php jest tekst pomiędzy znacznikiem otwierającym i zamykającym. Listę wyboru uzyskujemy wstawiając znaczniki „<select></select>”, a między nimi „<option></option>” dla każdej pozycji na liście. Atrybut „name” jest definiowany dla zancznika „<select>”, a „value” dla znaczników „<option>”. Nazwami wyświetlanymi na liści będą teksty pomiędzy znacznikami „<option></option>”. Jeżeli nie zdefiniujemy atrybutów „value”, to wartością znacznika będzie tekst wyświetlany. Domyślnie wybrany jest pierwszy element listy. Można to zmienić umieszczając w wybranym znaczniku „<option>” atrybut „selected” o wartości „selected”. Jeżeli potrzebujemy listy, z której można wybrać jednocześnie kilka opcji, to do znaczników „<select></select>” należy dodać atrybut „multiple” o wartości „multiple”, a do atrybutu name dodać na końcu „[]” – dzięki temu odpowiednia zmienna w skrypcie php będzie tablicą. Wybór wielu pozycji na takiej liście odbywa się poprzez przytrzymanie klawisza „ctrl” na klawiaturze i klikaniu wybranych pozycji.

O odbieraniu danych w php napiszę wkrótce.

Tagi: , ,

Dodaj odpowiedź