xhtml, ebooki

[ Pobierz całość w formacie PDF ]
XHTML, CSS i JavaScript
24. Jak zdeiniować tabelę w XHTML? / 62
25. Jak wykorzystać tabelę do budowy strony WWW? / 65
26. Jak stworzyć układ strony o postaci tabeli z wykorzystaniem
wyłącznie CSS? / 68
27. Jak umieścić na stronie WWW formularz? / 75
28. Jak wyświetlić na ekranie komunikat z wykorzystaniem
JavaScript? / 81
29. Jak wyświetlić element w oknie pop-up za pomocą
JavaScript? / 85
30. Jak przygotować galerię obrazów? / 87
31. Jak zdeiniować menu rozwijane za pomocą JavaScript? / 90

Spis treści
XHTML, CSS i JavaScript
F
ormularze pozwalają autorowi strony zbierać dane od osób
27. Jak umieścić
na stronie WWW
formularz?
odwiedzających jego serwis WWW i automatyzować kon-
takty. Mają postać elektronicznej ankiety, którą wypełnia się
wprost na stronie.
Formularz deiniujemy za pomocą elementu
form
z odpo-
wiednimi atrybutami, w którym umieszczamy pola formu-
larza:
<form action="
plik_docelowy
" method="post">
zawartość formularza
</form>
Pamiętaj, aby wszelkie zdania w formularzu, pola, zestawy
opcji itp. obejmować jakimiś pojemnikami, na przykład znacz-
nikami akapitu
<p>
czy bloku
<div>
.
W tym przykładzie przygotujemy formularz, który pozwoli
na wysyłanie za pomocą poczty elektronicznej wprowadzanych
przez użytkownika informacji. W związku z tym w deinicji
formularza powinniśmy umieścić specjalne polecenie wysyłania
formularza na wskazany adres:
action=="mailto:autor_strony@adres.pl".
Należy również określić sposób komunikowania się prze-
glądarki użytkownika z serwerem, a więc wskazać w kodzie,
czy przesyła ona jakieś informacje, czy też je pobiera. Do wybo-
ru mamy dwie metody —
post
lub
get
— zastosujemy metodę
post
.
Aby zebrane z formularza dane były w czytelnej postaci,
powinniśmy zastosować parametr
enctype="text/plain"
. Tak
więc znacznik
<form>
ma teraz postać:
<form enctype="text/plain" action="mailto:autor_strony@adres.
pl?subject=Ankieta" method="post">
Formularz może zawierać różnego typu pola, w które będą
wprowadzane dane — na przykład takie jak imię i nazwi-
sko, nazwa produktu, informacje o użytkowniku itp. Pola te
są podzielone na kilka podstawowych grup:
Pole
input
, z dodatkowymi parametrami
type
,
name
i
value
, służy do tworzenia pól, w których czytelnik
strony może wpisać informację lub wybrać jakąś opcję.
75
XHTML, CSS i JavaScript
Oto przykład:
<input type="text" name="nazwa_pola" value="wartość początkowa"
size="rozmiar pola w znakach" maxlength="maksymalny rozmiar
pola">
lub
<p><input type="checkbox" name="wybor" value="tak"> Tak</p>
Pole
select
służy do tworzenia rozwijalnych list z opcja-
mi, spośród których czytelnik wybiera interesujące
go pozycje:
<p><strong>Wybierz produkt:</strong></p>
<div>
<select name="warzywa" size="3">
<option> Avocado
<option> Cebula
<option> Ogórek
<option> Marchew
<option> Seler
</select>
</div>
textarea
jest poleceniem pozwalającym tworzyć większe
pole tekstowe z przeznaczeniem na dłuższy komentarz
czytelnika:
<form action="mailto:autor_strony@adres.pl">
<p><b>Wpisz swoje uwagi:</b></p>
<p><textarea name="Uwagi" rows="5" cols="55"></textarea></p>
</form>
76
27. Jak umieścić na stronie WWW formularz?
XHTML, CSS i JavaScript
Dodatkowo możemy wydzielić określone pola poprzez
zastosowanie do nich grupującego obramowania. Służy do tego
element
ieldset
:
<form>
<ieldset>
zawartość
</ieldset>
<ieldset>
zawartość
</ieldset>
</form>
Przydatny będzie także opis grupy pól — wprowadza go ele-
ment
legend
, na przykład:
<legend>Formularz - stosowane przeglądarki</legend>
Do formularza trzeba jeszcze dodać przycisk, który pozwoli
wysłać informacje podane przez czytelnika strony do jej autora.
Służy do tego polecenie
input
z atrybutem
type="submit"
. Gdy
użytkownik kliknie ten przycisk, wszystkie podane przez niego
informacje (ciągle zakładamy, że posługujemy się tu funkcją
poczty elektronicznej), jak zaznaczone opcje, wypełnione pola
tekstowe czy wybrane pozycje na liście, zostaną przesłane
w liście do autora:
<input type="submit" value="Wyślij do nas informacje">
Teraz czas na zastosowanie podanych tu informacji w prak-
tyce.
77
27. Jak umieścić na stronie WWW formularz?
[ Pobierz całość w formacie PDF ]

zanotowane.pl

doc.pisz.pl

pdf.pisz.pl

telefongry.keep.pl