Formulß°e II.

Ji°φ Kosek ml.

Dnes budeme pokraΦovat ve v²klad∙ jednotliv²ch prvk∙, kterΘ m∙₧eme pou₧φvat v HTML-formulß°φch.

ZaÜkrtßvacφ pole

Oblφben²m prvkem jsou zaÜkrtßvacφ pole (checkboxes). Ty u₧ivateli umo₧≥ujφ zadßvßnφ logick²ch hodnot ano/ne. V praxi b²vajφ zobrazeny jako ΦtvereΦek, kter² je mo₧no nechat prßzdn² nebo jej zaÜkrtnout. Pokud je ΦtvereΦek zaÜkrtl², poÜle se jeho jmΘno (obsah atributu NAME) na server spoleΦn∞ s obsahem atributu VALUE. Ve formulß°i m∙₧eme mφt i n∞kolik zaÜkrtßvacφch polφ se stejn²m jmΘnem, kterß k sob∞ logicky pat°φ.

Pro vlo₧enφ zaÜkrtßvacφch polφ se op∞t pou₧φvß element INPUT, tentokrßte vÜak s atributem TYPE nastaven²m na hodnotu CHECKBOX:

<FORM ACTION=09-01.asp METHOD=GET>
<TABLE FRAME=BORDER RULES=NONE CELLPADDING=4>
<CAPTION>Vyberte si dopl≥ujφcφ konfiguraci poΦφtaΦe:
</CAPTION>
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace"
           VALUE=CD-ROM>Mechanika CD-ROM
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace"
           VALUE=ZIP>Mechanika ZIP 100MB
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace"
           VALUE=SOUND>Zvukovß karta
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace"
           VALUE=MODEM>Modem US Robotic 28,8 kbit/s
<TR><TH>
    <INPUT TYPE=SUBMIT VALUE="Potvrzenφ konfigurace">
</TABLE>
</FORM>

Pro lepÜφ zformßtovßnφ jsme cel² formulß° umφstili do tabulky (obr. 1).

Obr. 1: Ukßzka formulß°e se zaÜkrtßvacφmi tlaΦφtky

Obsluhujφcφ skript pro ASP pak m∙₧e se zφskan²mi daty nalo₧it dle pot°eby. My pouze vypφÜeme, jak se mß poΦφtaΦ rozÜφ°it (09-01.asp):

<HTML>
<HEAD>
<TITLE>Dopl≥kovß konfigurace</TITLE>
</HEAD>
<BODY>
<%
For i=1 To Request.QueryString("Konfigurace").Count
    Konf = Request.QueryString("Konfigurace")(i)
    If Konf = "CD-ROM" Then
        Response.Write "Namontuj CD-ROM!<BR>"
    ElseIf Konf = "ZIP" Then
        Response.Write "Namontuj mechaniku ZIP!<BR>"
    ElseIf Konf = "SOUND" Then
        Response.Write "Namontuj zvukovou kartu!<BR>"
    ElseIf Konf = "MODEM" Then
        Response.Write "Namontuj modem!<BR>"
    End If
Next
%>
</BODY>
</HTML>

Z formulß°e m∙₧e p°ijφt vφce stejn∞ pojmenovan²ch polo₧ek, a proto je obsluha zaÜkrtßvacφch polφ troÜku slo₧it∞jÜφ. V naÜem p°φpad∞ ji₧ nenφ Request.QueryString("Konfigurace") pouhou prom∞nnou, ale kolekcφ. Kolekce je datovß struktura, kterß m∙₧e obsahovat n∞kolik polo₧ek stejnΘho typu -- je velice podobnß polφm tak, jak je znßme z klasick²ch programovacφch jazyk∙. U ka₧dΘ kolekce m∙₧eme zjistit poΦet prvk∙ pomocφ metody Count. NßÜ skript tedy obsahuje cyklus, kter² se provede pro vÜechny prvky kolekce (od 1 a₧ do Request.QueryString("Konfigurace").Count).

JednotlivΘ prvky kolekce jsou p°φstupnΘ pomocφ svΘho indexu, kter² se zapisuje do kulat²ch zßvorek za jmΘno kolekce. Tφmto zp∙sobem ji₧ zjistφme konkrΘtnφ hodnotu, kterou skript obdr₧el od u₧ivatele. Tu ve skriptu otestuje a provedeme p°φsluÜnΘ akce.

V PHP se pro prßci se zaÜkrtßvacφmi polφΦky, kde jednomu jmΘnu odpovφdß vφce hodnot, rovn∞₧ pou₧φvajφ pole. Aby vÜe sprßvn∞ fungovalo, je vÜak formulß° pot°eba drobn∞ upravit. Mφsto jmΘna vstupnφho prvku NAME="Konfigurace" musφme psßt NAME="Konfigurace[]", tj. p°idßme na konec hranatΘ zßvorky. Pro takto pojmenovan² prvek formulß°e pak PHP samo vytvo°φ pole. Upraven² formulß°:

<FORM ACTION=09-01.php3 METHOD=GET>
<TABLE FRAME=BORDER RULES=NONE CELLPADDING=4>
<CAPTION>Vyberte si dopl≥ujφcφ konfiguraci poΦφtaΦe:
</CAPTION>
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace[]"
           VALUE=CD-ROM>Mechanika CD-ROM
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace[]"
           VALUE=ZIP>Mechanika ZIP 100MB
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace[]"
           VALUE=SOUND>Zvukovß karta
<TR><TD>
    <INPUT TYPE=CHECKBOX NAME="Konfigurace[]"
           VALUE=MODEM>Modem US Robotic 28,8 kbit/s
<TR><TH>
    <INPUT TYPE=SUBMIT VALUE="Potvrzenφ konfigurace">
</TABLE>
</FORM>

V PHP poΦet prvk∙ pole zjistφme pomocφ funkce Count(pole). JednotlivΘ prvky pole jsou p°φstupnΘ pomocφ indexu, kter² musφme zapsat do hranat²ch zßvorek. Narozdφl od VBScriptu, kter² je pou₧φvßn v ASP, jsou pole indexovßna od nuly. V²sledn² skript 09-01.php3 v PHP tak m∙₧e vypadat takto:

<HTML>
<HEAD>
<TITLE>Dopl≥kovß konfigurace</TITLE>
</HEAD>
<BODY>
<?
for ($i=0; $i<Count($Konfigurace); $i++):
    $Konf = $Konfigurace[$i];
    if ($Konf=="CD-ROM"):
        echo "Namontuj CD-ROM!<BR>";
    elseif ($Konf=="ZIP"):
        echo "Namontuj mechaniku ZIP!<BR>";
    elseif ($Konf=="SOUND"):
        echo "Namontuj zvukovou kartu!<BR>";
    elseif ($Konf=="MODEM"):
        echo "Namontuj modem!<BR>";
    endif;
endfor;
?>
</BODY>
</HTML>

ZaÜkrtßvacφ pole jsou na formulß°i normßln∞ zobrazena nezaÜkrtnutß. Pokud chceme, aby bylo tlaΦφtko rovnou zaÜkrtnutΘ, pou₧ijeme u n∞j atribut CHECKED. Malß ukßzka Φßsti formulß°e:

Dßte si kßvu:
<BLOCKQUOTE>
<INPUT TYPE=CHECKBOX NAME=Ingredience 
       VALUE=mleko>s mlΘkem<BR>
<INPUT TYPE=CHECKBOX NAME=Ingredience 
       VALUE=cukr CHECKED>s cukrem
</BLOCKQUOTE>

Na obrßzku 2 vidφme, ₧e druhΘ tlaΦφtko je rovnou zaÜkrtnuto.

Obr. 2: U druhΘho tlaΦφtka je pou₧it atribut CHECKED

P°epφnacφ tlaΦφtka

P°epφnacφ tlaΦφtka se do formulß°e vklßdajφ op∞t pomocφ elementu INPUT, tentokrßte vÜak musφme pou₧φt atribut TYPE=RADIO. Pou₧ijeme je v p°φpad∞, kdy chceme u₧ivateli nabφdnout mo₧nost v²b∞ru jednΘ z n∞kolika variant. ZaÜkrtßvacφ tlaΦφtka odpovφdajφcφ jednotliv²m variantßm musφ mφt nastaven atribut NAME na stejnou hodnotu. Naopak atribut VALUE musφ mφt ka₧dß varianta jedineΦn². ╚ßst fiktivnφho formulß°e, kter² slou₧φ k v²b∞ru konfigurace poΦφtaΦe m∙₧e vypadat i takto:

Po₧adovanß velikost pevnΘho disku:
<BLOCKQUOTE>
<INPUT TYPE=RADIO NAME=HD VALUE=1200>1,2 MB<BR>
<INPUT TYPE=RADIO NAME=HD VALUE=1600 CHECKED>1,6 MB<BR>
<INPUT TYPE=RADIO NAME=HD VALUE=2100>2,1 MB<BR>
<INPUT TYPE=RADIO NAME=HD VALUE=4200>4,2 MB<BR>
<INPUT TYPE=RADIO NAME=HD VALUE=6400>6,4 MB
</BLOCKQUOTE>

P°epφnacφ tlaΦφtka jsme umφstili mezi tagy <BLOCKQUOTE> a </BLOCKQUOTE>, aby byla odsazena vpravo. Za ka₧dou polo₧kou formulß°e je pou₧it tag <BR>, kter² zp∙sobuje p°echod na novou °ßdku.

Obr. 3: P°epφnacφ tlaΦφtka v akci

Obslu₧nΘmu skriptu dorazφ hodnota VALUE vybranΘho p°epφnacφho tlaΦφtka. V naÜem p°φpad∞ tedy budeme mφt hodnotu 1200, 1600, 2100, 4200 nebo 6400 v prom∞nnΘ $HD (PHP) nebo v Request.QueryString("HD") (ASP).

TlaΦφtko s obrßzkem

Zatφm umφme formulß° odeslat na server pouze pomocφ tlaΦφtka SUBMIT. Existuje vÜak jeÜt∞ jedna mo₧nost. K odeslßnφ m∙₧e slou₧it i obrßzek. Pokud na n∞j u₧ivatel klikne, odeÜle se serveru obsah formulß°e spoleΦn∞ se sou°adnicemi kliknutφ.

Obrßzek, kter² slou₧φ k odeslßnφ formulß°e se vklßdß op∞t pomocφ elementu INPUT. Jako hodnotu atributu TYPE vÜak musφme pou₧φt IMAGE. Adresa obrßzku se zadßvß pomocφ atributu SRC. Podobn∞ jako u obrßzk∙ m∙₧eme pou₧φt atributy ALT pro popis obrßzku a ALIGN pro urΦenφ zarovnßnφ obrßzku s okolnφm textem.

<FORM ACTION="skript" METHOD=GET>
<TABLE BORDER=0>
<TR VALIGN=TOP>
<TD>
    Vyberte si ukazatel:
    <BLOCKQUOTE>
    <INPUT TYPE=RADIO NAME=Ukazatel
           VALUE=Natalita CHECKED>Natalita<BR>
    <INPUT TYPE=RADIO NAME=Ukazatel
           VALUE=Mortalita>Mortalita<BR>
    <INPUT TYPE=RADIO NAME=Ukazatel
           VALUE=Rozvodovost>Rozvodovost<BR>
    <INPUT TYPE=RADIO NAME=Ukazatel
           VALUE=Obyvatelstvo>PoΦet obyvatel<BR>
    <INPUT TYPE=RADIO NAME=Ukazatel
           VALUE=Vek>Pr∙m∞rn² v∞k obyvatel<BR>
    </BLOCKQUOTE>
</TD>
<TD>
    Vyberte si stßt:<BR>
    <INPUT TYPE=IMAGE NAME=Mapa SRC="au-mapa.gif" 
           ALT="Mapa Austrßlie">
</TD>
</TR>
</TABLE>
</FORM>

V PHP budou sou°adnice kliknutφ myÜφ na obrßzek p°φstupnΘ v prom∞nn²ch $Mapa_x a $Mapa_y. Prefix p°ed jmΘnem sou°adnice odpovφdß jmΘnu vstupnφho prvku urΦenΘmu pomocφ atributu NAME. V ASP budou sou°adnice kliknutφ dostupnΘ pomocφ Request.QueryString("Mapa.x") a Request.QueryString("Mapa.y").

Obr. 4: Formulß° s klikacφ mapou

AΦ to tak ani nevypadß, nem∞li bychom tlaΦφtko IMAGE moc pou₧φvat. Jednak je takov² formulß° nepou₧iteln² v textov²ch prohlφ₧eΦφch jako je Lynx a jednak je zpracovßnφ informacφ o sou°adnicφch kliknutφ v skriptu pom∞rn∞ komplikovanΘ.

P°φÜt∞ se podφvßme na dalÜφ zajφmavß zßkoutφ formulß°∙. Povφme si, jak pomocφ formulß°e odeslat na server soubor.