Stáhnout prezentaci
Prezentace se nahrává, počkejte prosím
1
HTML Formuláře
2
Formulář Dynamické interaktivní stránky
Návštěvník může komunikovat se serverem Zadávat osobní data, heslo, psát a posílat text, atp. Formulář je svázán s nějakou procedurou nebo scripty (java script,php,...)
3
Formulář příklad
4
Formulář HTML <form > … </form> Attributy: Příklad:
name jméno fromuláře action skript, který bude zpracovávat data method způsob předávání dat enctype způsob zakódování dat Příklad: <form name=“form1” action=“javascript:muj_script();” method=“get” enctype=“text/plain”> <!-- definice formulare --> </form>
5
Tlačítko = Button <input type=“button”> Atributy:
onClick jméno scriptu který se vykoná value jméno tlačítka Příklad: <form> <input type=“button” onClick=“javascript:mojefunkce();” value=“OK”> </form> OK
6
Tlačítko OK = submit <input type=“submit”> Atributy:
value jméno tlačítka Příklad: <form> <input type=“submit” value=“OK”> </form> OK
7
Tlačítko Reset = reset <input type=“reset”> Atributy:
value jméno tlačítka Příklad: <form> <input type=“reset” value=“Vymazat”> </form> Vymazat
8
Text: 1 řádek <input type=“text”> Attributy:
value předdefinovaný text size velikost dialogu maxlength maximální počet znaků name jméno Příklad: <form> jméno:<input type=“text” size=40 value=“xxx” name=“tx”> </form> jméno: xxx
9
heslo: password <input type=“password”> Attributy:
value předdefinovaný text size velikost dialogu maxlength maximální počet znaků name jméno Příklad: <form> jméno:<input type=“password” value=“xxx” name=“tx”> </form> jméno:
10
Text: více řádků <textarea>text</textarea> Attributy:
cols šířka rámečku: počet znaků na řádku rows výška rámečku: počet řádků name jméno Příklad: <form> text:<textarea rows=3 cols=40>xxx</textarea> </form> text: xxx
11
Zatržítko: checkbox <input type=“checkbox”> Attributy:
name jméno CHECKED Příklad: <form> koníčky: sport <input type=“checkbox” CHECKED> hudba <input type=“checkbox” > </form> koníčky: sport hudba
12
Přepínač: radio <input type=“radio”> Attributy:
name jméno (musí být stejné pro všechna svázaná tlačítka) CHECKED Příklad: <form> pohlaví: muž <input type=“radio” name=“rb” CHECKED> žena <input type=“radio” name=“rb”> </form> pohlaví: žena muž
13
Rozevírací nabídka: select
<select> <option>1</option> <option>2</option> …</select> Attributy select: name jméno Atributy option: value hodnota SELECTED vybraná položka Příklad: <form> Jazyk: <select name=“nabidka”> <option value=“český” SELECTED> český </option> <option value=“anglický”> anglický </option> </select> </form> Jazyk: český v český anglický český
14
Seznam: select <select MULTIPLE> <option>1</option> <option>2</option> …</select> Attributy select: name jméno Atributy option: value hodnota SELECTED vybraná položka Příklad: <form> Jazyk: <select MULTIPLE name=“nabidka”> <option value=“český” SELECTED> český </option> <option value=“anglický”> anglický </option> </select> </form> Jazyk: český anglický český
15
JavaScript Skript na stránce Skript v dokumentu vytvoříte tak, že ho
napíšete mezi značky <script> a </script>. <html> <body> <script> document.write("ahoj"); </script> </body> </html>
16
JavaScript Externí skript
Skript je uložen v samostatném souboru a jeho obsah není vidět v dokumentu. <html> <body> <script language="JavaScript" type="text/javascript" src="funkce.js"></script> </body> </html>
17
JavaScript - Funkce Funkce je kousek skriptu, který můžete opakovaně vyvolávat. Funkce šetří čas a námahu. Příklad: <script> function napis(jmeno) { document.write(jmeno); } </script> napis(“Jim”); -> napíše Jim napis(“Jan”); -> napíše Jan
18
Formátování formuláře
<table> <tr><td>jméno</td><td><input type=“text”></td> <tr><td>příjmení</td><td><input type=“text”</td> </table> jméno příjmení
19
Bez tabulky jméno <input type=“text”> <br>
příjmení <input type=“text”> jméno příjmení
Podobné prezentace
