Pokud potřebujete získat informace od uživatele vašich stránek, můžete použít formuláře. Formulář se uživateli jeví podobně jako dialogové okno a může obsahovat různá vstupní pole, tlačítka a přepínače. Získané informace jsou odeslány na server ke zpracování. Ke zpracování údajů z formulářů se nejvíce používá PHP, ASP, CGI skripty.
Formulář se vkládají pomocí elementu FORM. Pro správnou funkci formuláře musíte zajistit obsluhu ACTION a METHOD:
ACTION - určení adresy skriptu, který zpracuje data METHOD - určuje metodu, která se při odeslání dat použije - GET/POST
Hlavička takového formuláře by potom vypadala nějak takto:
<FORM ACTION="http:\\pokus.php" METHOD=POST/GET"> ... </FORM>
Pokud neumíte (nemůžete používat) PHP/ASP, můžete si nechat poslat data poštou. Pak musíte nastavit atribut ACTION na mailto:
<FORM ACTION="mailto:jansova@iol.cz" METHOD=POST> ... </FORM>
Pozn: Pro své formuláře zatím používejte metodu POST, více se dovíte v kapitole o protokolech (v jiné knize).
Dalším atributem je element ENCTYPE. Ten můžete použít pro nastavení kódování obsahu formuláře. Prozatím nic nenastavujte, vysvětlím později.
Při tvorbě formulářů, můžete použít tři základní elementy pro prvky formuláře:
INPUT - slouží pro většinu prvků SELECT - seznamy TEXTAREA - prvek pro víceřádkový text
Druh prvku vyberete pomocí atributu TYPE. Atributem NAME musíte nastavit jméno prvku. Obecný zápis:
<INPUT TYPE=(typ) NAME=(jméno)>
Pro úplnost popisuji jednotlivé prvky, ale věřte, že to dalo práci.
Slouží k zadání kratších textů. Atributy:
MAXLENGTH - omezení maximální délky textu SIZE - velikost vstupního pole VALUE - počáteční hodnota
Příklad pole, kam zadáte svůj e-mail:
E-mail: <INPUT TYPE=TEXT NAME="e-mail">
Výstup:
E-mail: |
Pokud potřebujete více vstupních polí, je vhodné je zarovnat pomocí tabulky:
<TABLE> <TR> <TD>Jméno: </TD> <TD><INPUT TYPE=TEXT NAME="jmeno" SIZE=30></TD> </TR> <TR> <TD>Příjmení: </TD> <TD><INPUT TYPE=TEXT NAME="prijmeni" SIZE=30></TD> </TR> </TABLE>
Výstup:
|
Prvek je velmi podobný prvnímu, jen místo zadaných znaků jsou zobrazovány hvězdičky.
Prvek slouží pro vstup logických hodnot. Prohlížeč tento prvek zobrazuje jako okénko. Musíte nastavit NAME a atribut VALUE. Pokud je pole zaškrtnuté, pošle se jeho jméno společně s hodnotou atributu VALUE serveru. Pokud není pole zaškrtnuto, prvek nic nepošle. Pokud chcete pole zaškrtnuté hned na začátku, použijte atribut CHECKED.
Jako příklad ukáži část jednoduché ankety o OS:
<P><INPUT TYPE=CHECKBOX NAME="os" VALUE="linux" CHECKED> Linux<BR> <INPUT TYPE=CHECKBOX NAME="os" VALUE="windows"> Windows</P>
Výstup:
Linux Windows |
Pokud chcete dát na výběr pouze jednu možnost (OS může přece člověk používat více), použijte tento prvek. Ještě musím poznamenat, že velmi často se používá tag pro odsazení: <BLOCKQUOTE>.
Zaškrtněte, jestli jste muž, nebo žena:
<BLOCKQUOTE> <INPUT TYPE=RADIO NAME="pohlavi" VALUE="zena" CHECKED>Žena<BR> <INPUT TYPE=RADIO NAME="pohlavi" VALUE="muz">Muž </BLOCKQUOTE>
Výstup:
|
Jistě jste již viděli stránky, kde jste mohli poslat své soubory. Prvek se obvykle zobrazí jako vstupní textové pole s tlačítkem. Atributy:
MAXLENGTH - omezení maximální délky textu SIZE - velikost vstupního pole ACCEPT - určuje MIME typ souboru, který je přípustné vybrat
Jediné pole, které se ve formuláři neobjeví. Většinou je používáno pro uchování stavových informací. Informace bude uložena v podobě "proměnné". Musíte nastavit atributy VALUE a NAME. Dnes se moc nepoužívá a pokud to jde, má přednost cookies.
Pokud již máte vhodně poskládané prvky formuláře, musíte dát možnost uživateli formulář odeslat. K tomu můžete použít element INPUT se spojením s atributem TYPE=SUBMIT. Tak vytvoříte tlačítko, po jehož stisku bude formulář se zadanými daty (lépe řečeno data získaná od uživatele z formuláře) odeslán serveru. Příklad takového tlačítka:
<INPUT TYPE=SUBMIT VALUE="Odeslat">
Výstup:
Pokud chcete tlačítko s obrázkem, můžete použít atribut SRC. Jeden takový příklad:
<INPUT TYPE=IMAGE NAME="s_obrazkem" SRC="obraz.gif">
Pokud chcete dát možnost resetovat vyplněný formulář, použijte toto tlačítko. Po jeho stisku se prvky formuláře nastaví na počáteční hodnotu. Nikdy není odesíláno na server. Pomocí atributu VALUE lze tlačítko pojmenovat.
Pro tvorbu seznamů, můžete použít element SELECT. Seznamy můžete použít, pokud chcete dát uživateli na výběr jedné z několika položek. Pokud chcete dát na výběr více položek, použijte atribut MULTIPLE. Atributem SIZE můžete vybrat počet najednou zobrazených řádek.
Jednotlivé položky seznamu zadávejte jako obsah elementu OPTION. Ukončovací element můžete vynechat. Položky, u kterých použijete atribut SELECTED, budou již předem vybrány.
<SELECT NAME="nakup" SIZE=5 MULTIPLE> <OPTION VALUE="jablko">jablko <OPTION VALUE="rajce">rajče <OPTION VALUE="jogurt">jogurt </SELECT>
Výstup:
Element TEXTAREA slouží pro zadání delších textů. Atributy:
NAME - jméno ROWS - počet řádek vstupního pole COLS - počet sloupců
Jeden takový příklad:
<TEXTAREA NAME="hodnoceni" ROWS="4" COLS="30"> Napište, jak se vám stránky libí </TEXTAREA>
Výstup: