12 Formuláře + Robot
Doposud jsme řešili obsluhu uživatelských akcí pomocí událostí. Tlačítku jsme nastavili onClick událost, která nás odkázala na funkci v skriptové části. Na podnět Toma si dnes představíme formuláře a vytvoříme si svůj vlastní "vyhledávač":
Vyhledej videa na téma:
Proč formuláře?
Jak už jsem zmínila dříve, v rámci výuky bastlíme všechno dohromady - styly, skripty, html - vše v jednom dokumentu. Protože děláme "jednoduché" věci na několik málo řádku, je tento způsob přehledný. V praxi, kdy třeba jen styly jsou na sto řádků, bychom se v takovém zdrojáku uskrolovali k smrti. No a stejně jako můžeme styly vypreparovat do zvláštního souboru s koncovkou .css, můžeme i programovou část řešit zvlášť. Formuláře slouží k tomuto způsobu, kdy ve formuláři jen sesbíráme data a pošleme je na zpracování někam pryč.
Jak na to?
Všechny ovládací prvky (tlačítka, kolonky, zaškrtávátka,...), tedy tágy <input>, strčíme do formuláře.
<form action="https://www.youtube.com/">
<input type="text" name="tema">
<input type="submit">
</form>
Každý formulář by měl mít tlačítko k odeslání <input type="submit">, kterým dojde k odeslání formuláře.
? Kam se formulář odešle určuje atribut formuláře action. V ukázce jsme zadali zadali, že chceme formulář odeslat ke zpracování na youtube.
? Co vlastně posíláme na youtube?? Posíláme tam vyplněná data z našeho formuláře. Jednotlivé prvky formuláře proto musíme mít pojmenovány. Naše jediná kolonka z ukázky má jméno tema name="tema". Je to v podstatě to samé jako id, které jsme používali dříve. Proč formuláře neumí pracovat s id, fakt netuším.
? Jak se odešle formulář? Existují dvě metody k odeslání formuláře výchozí metoda get, která pošle data v URL adrese. V podstatě nastartuje stránky podobně jako odkaz, jen za otazník přilepí vyplněná data. Další metoda post se používá, nechceme-li aby byly odesílané data vidět.
Jdeme zkoušet
Vyzkoušej si formulář z ukázky výše, napiš do kolonky třeba "pes" a klikni na tlačítko. Nic zvláštního se nestalo. Jen se nastartoval jůtub. Ale přece jen se něco povedlo. Mrkni do url adresy. Na konci je ?tema=pes. Tedy název textboxu z tvého vyhledávače a vyplněná hodnota. Povedlo se ti tedy odeslat formulář na youtube. A kdyby youtube rozuměl tvému formuláři, určitě by ti vyhledal videa o psovi.
Jenže youtube tvému formuláři nerozumí. Pojmenoval si svůj textbox jinak než ty. Když zjistíš jak, podaří se ti podstrčit mu svůj formulář tak, že mu bude rozumnět. Zadej nyní do standardního vyhledávače na youtubu třeba toho psa a podívej se, do URL adresy.
Vidíš rozdíl?
1) Vyhledáváš-li přes youtube, jeho textbox se jmenuje search_query, nikoli tema jako u tebe
2) Vyhledáváš-li přes youtube, odešle se formulář na adresu https://www.youtube.com/results
Upravíš-li svůj vlastní vyhledávač, tak aby se formulář odeslal na správnou adresu a přejmenuješ li svou kolonku na stejné jméno jako má youtube, budeš mít svůj vlastní youtube-vyhledávač.
Podobně můžeš udělat vyhledávač na seznam, nebo google. Stačí jen odpozorovat, jaké názvy textboxů používají tyto vyhledávače a ty použít i ve svém.
PS.: Tohle sice vypadá jako těžká frajeřina. Hele naprogramoval jsem google vyhledávač. Ale ve skutečnosti jen využíváš službu googlu. Vyhledávače samy o sobě, mají prográmky (roboty), kteří každý den procházejí Internet, projíždějí všechny odkazy, které najdou, zpracovávají text, ukládají jej do svých databází a pak vyhledávají ve svých vlastních datech. Jde o složitý proces, který nikomu nepoví, neboť je to jejich přísně tajné know how.