┌vod do formulß°∙

Dva problΘmy - Nejjednodu╣╣φ formulß° - Vstupnφ pole - Zpracovßnφ parametr∙

Dva problΘmy

  1. Vlo╛it formulß° do strßnky
    Lze to zajistit celkem snadno pomocφ n∞kolika HTML tag∙. V∞t╣ina nßvod∙ popisujφcφ formulß°e se zab²vß pouze tφmto problΘmem.
  2. Zajistit jeho funkΦnost
    UvΘst formulß° do provozu tak, aby fungoval, je problΘm mnohem obtφ╛n∞j╣φ. Obvykle je na to pot°eba pou╛φt n∞jak² program nebo skript. Potφ╛e jsou pak dvojφ:
    1. um∞t to rozb∞hat
    2. sm∞t to rozb∞hat (mφt prßva a podporu na serveru).

Na tΘto strßnce vysv∞tlφm vklßdßnφ jednoduch²ch formulß°∙ do strßnek a zßklady jejich Φinnosti p°i odesφlßnφ dat. ┌Φelem bude naznaΦit vzßjemnou podobnost jednoduch²ch formulß°∙ a jednoduch²ch odkaz∙.

Nejjednodu╣╣φ formulß°

Do HTML k≤du se vlo╛φ tato sekvence:

 

<form action="stranka.html">
   <input type=submit value=odeslat>
</form>

 

Takhle to vypadß:

M∙╛ete se podφvat na strßnku s p°φkladem.

 V²znam tag∙

<form> zaΦφnß a konΦφ formulß°.

<input type=submit> je odesφlacφ tlaΦφtko. To "submit" znamenß "potvrdit". Input je tag nepßrov².

value=odeslat je nßpis na tlaΦφtku.

action="stranka.html" je cφl formulß°e, prost∞ soubor, kterΘmu se posφlajφ p°φpadnß data. (V praxi je to n∞jak² serverov² skript.) V tomto p°φpad∞ se ╛ßdnß data neposφlajφ, odeslßnφ formulß°e funguje prost∞ jako odkaz na strßnku stranka.html.

Tento nejjednodu╣╣φ formulß° funguje vlastn∞ jako odkaz na strßnku stranka.html.

Vstupnφ pole

 Jist∞ se shodneme na tom, ╛e jedno tlaΦφtko je houby formulß°. Je Φas zkusit zadßvat ·daje.

<form action="stranka.html">
OblφbenΘ jφdlo:
<input type=text size=16 name="jidlo">
   <input type=submit value=odeslat>
</form>

Takhle to vypadß:

OblφbenΘ jφdlo:

M∙╛ete se podφvat na p°φklad, zadat si hodnotu a zkusit odeslßnφ.

V²znam tag∙

V prvnφ °ad∞ jist∞ vidφte, ╛e do formulß°e se dß normßln∞ vklßdat obyΦejn² text (popisek "OblφbenΘ jφdlo").

<input type=text> je tentokrßte nikoli tlaΦφtko, ale vstupnφ pole. Rozdφl d∞lß ten atribut type. Tag <input> dßle obsahuje atributy size (╣φ°ka ve znacφch), ale hlavn∞ name.

name="jidlo" je ╛ivotn∞ d∙le╛it² atribut, podle n∞ho╛ se vstupnφ pole identifikuje. Jde vlastn∞ o nßzev vstupnφho pole. Text nßzvu (v tomto p°φpad∞ "jidlo") se bude posφlat spoleΦn∞ se zadan²mi daty. Atribut name musφ mφt ka╛d² vstupnφ prvek formulß°e.

Jinak je v╣e jako v p°edchozφm p°φkladu.

P°edßvßnφ parametr∙

Dejme tomu, ╛e si do vstupnφho polφΦka vyplnφm text "ryby" a ode╣lu. Bude m∞ zajφmat, co se stane a jakΘ bude URL (to, co se napφ╣e do °ßdku adresy).

Cφlem je stejn∞ jako minule soubor stranka.html (to zaji╣╗uje action), cestou k n∞mu bude URL zaΦφnat. To, co je nynφ d∙le╛itΘ, se objevφ za tφm "stranka.html".

Konec adresy cφlovΘ strßnky .../stranka.html?jidlo=ryby

Objevφ se tam otaznφk a n∞jakΘ parametry. V tomto p°φpad∞ tam bude ?jidlo=ryby

To "jidlo" odpovφdß jmΘnu textovΘho vstupnφho pole (to je ten atribut name v tagu <input>). Text "ryby" jsem zadal p°ed odeslßnφm formulß°e.

Oblast URL za otaznφkem (za kterou b²vß odpov∞dn² formulß°) se jmenuje "query string", n∞kdy b²vß oznaΦovßna jako "search" a jß jφ budu °φkat prost∞ dotaz.

Podobnost s odkazem

Naprosto stejnΘho efektu mohu dosßhnout odkazem, kter² bude mφt trochu komplikovan∞j╣φ href:

<a href="stranka.html?jidlo=ryby">OblφbenΘ jφdlo</a>

Hlavnφ a jedin² rozdφl je v tom, ╛e takto jsou tam ty ryby napevno, tak╛e se tam nedß zadat t°eba s²r.

Vφce vstupnφch polφ

Pokud je ve formulß°i vφce vstupnφch polφ, jednotlivΘ polo╛ky dotazu se samy odd∞lujφ znakem &. Nap°φklad:

...stranka.html?jidlo=ryby&piti=caj

Zpracovßnφ parametr∙

Tak fajn, cφlovß strßnka dostala v dotazu (v URL) informaci o mΘm oblφbenΘm jφdle. Co s tφm ud∞lß?

V na╣em konkrΘtnφm p°φpadu s tφm neud∞lß nic, proto╛e je to ·pln∞ obyΦejnß HTML strßnka, kterß dotazy neumφ zpracovßvat. Prost∞ to za otaznφkem ignoruje.

ServerovΘ skripty

Jinß situace by byla, kdybych formulß° posφlal na n∞jak² sv∙j serverov² skript. Jinak °eΦeno atribut action by musel b²t zacφlen nikoliv na soubor typu html, ale t°eba PHP, ASP nebo CGI skript. (Mn∞ osobn∞ p°irostly k srdci PHP skripty.)

R∙znΘ typy skript∙ zpracovßvajφ dotaz r∙zn²mi zp∙soby. NejΦast∞ji si ale polo╛ky dotazu p°evedou do prom∞nn²ch, kterΘ dßle zpracovßvajφ. Nakonec po╣lou prohlφ╛eΦi v²stup formßtovan² do HTML.

Nechci ve vß╛enΘm Φtenß°i vzbuzovat nad∞ji, ╛e serverovΘ skripty jsou n∞co snadnΘho. Je to ost°e t∞╛kß v∞c, v urΦitΘm smyslu vrchol webov²ch technologiφ. Smi°te se s tφm, ╛e do jejich taj∙ neproniknete nijak lehce. Na druhou stranu nepropadejte panice -- v╣echno jde, kdy╛ se chce. (Nßvod na serverovΘ skripty zatφm pφ╣u. K nahlΘdnutφ je nßvod jak zaΦφt s PHP a mo╛nosti PHP.)

Parazitnφ formulß°e

V²sledky formulß°e m∙╛ete takΘ poslat na cizφ server a vyu╛φvat tak jeho mo╛nosti. Action musφ b²t nastavena na absolutnφ adresu cizφ strßnky.

Dal╣φ: Syntaxe formulß°∙ v HTML
Vizte tΘ╛: Zdokonalenφ formulß°∙, Jak zaΦφt s PHP, Mo╛nosti PHP, Programovßnφ strßnek, Parazitnφ formulß°e, Formulß° na mail

o tvorb∞, ·dr╛b∞ a zlep╣ovßnφ internetov²ch strßnek

Pφ╣e Yuh∙, dusan@pc-slany.cz

Hledßnφ:

Jak psßt web: www.jakpsatweb.cz

Pφ╣e Yuh∙: http://dusan.pc-slany.cz, mail: dusan@pc-slany.cz

Poslednφ aktualizace 10.12.2003