Formuláře
Příklad jednoduchého formuláře
Značka <form>
Značka <input>
Značka <input type="checkbox>
Značka <input type="radio>
Značka <input type="file>
Značka <input type="image>
Značka <input type="button>
Značka <input type="reset>
Značka <input type="submit>
Značka button
Značka textarea
Značka select
Značka option
Značka optgroup
Značka label
Značka fieldset
Značka legend
11.
Značka button
Tlačítko.
Zápis: (všiměte si obsahu mezi
<button ...>
a
</button>
)
< form action ="formular2.php" method ="post" name ="formular" >
< input name ="jmenotext" type ="text" value ="napiste neco" >< br >
< button type ="submit" >< img src ="execute.gif" alt ="Klikni" width ="16" height ="16" > Klikni na mě </ button >
</ form >
Se zobrazí jako:
Atributy:
type
povolené hodnoty
submit
,
reset
nebo
button
,
Hodnota
button
promění tlačítko v obyčejné. (použití v JavaScriptu)
Další atributy:
accesskey
,
class
,
dir
,
disabled
,
id
,
lang
,
name
,
style
,
tabindex
,
title
,
value
a atributy událostí (
onBlur
,
onClick
,
onDblClick
,
onFocus
,
onKeyDown
,
onKeyPress
,
onKeyUp
,
onMouseDown
,
onMouseMove
,
onMouseOut
,
onMouseOver
,
onMouseUp
.
12.
Značka textarea
Víceřádková oblast textu.
Zápis:
< form action ="formular5.php" method ="post" name ="formular" >
< textarea name ="spszl" cols ="30" rows ="4" > SPS Zlin
trida Tomase Bati 4187
762 47 Zlin </ textarea >< br >
< input name ="jmenosubmit" type ="submit" value ="OK" > poslat
</ form >
Se zobrazí jako:
Atributy:
cols
,
rows
určují počet znáků a počet řádků
Hodnota
virtual
znamená že text se zalamuje uživateli, ale na server se zasíla nezalomený text.
Hodnota
fysical
znamená že text zalomený pro uživatele je takto zalomený zaslán na server.
Další atributy:
accesskey
,
class
,
dir
,
disabled
,
id
,
lang
,
name
,
readonly
,
style
,
tabindex
,
title
a atributy událostí (
onBlur
,
onChange
,
onClick
,
onDblClick
,
onFocus
,
onKeyDown
,
onKeyPress
,
onKeyUp
,
onMouseDown
,
onMouseMove
,
onMouseOut
,
onMouseOver
,
onMouseUp
,
onSelect
.
13.
Značka select
Výběr z několika možností.
Zápis:
< form action ="formular6.php" method ="post" name ="formular" >
< select name ="vyber" size ="3" >
< option > 1999 </ option >
< option > 2000 </ option >
< option > 2001 </ option >
< option > 2002 </ option >
< option > 2003 </ option >
< option > 2004 </ option >
< option > 2005 </ option >
</ select >
< input name ="jmenosubmit" type ="submit" value ="OK" > poslat
</ form > Se zobrazí jako: (Výběr jedné volby
name="vyber"
.)
1999
2000
2001
2002
2003
2004
2005
poslat
Zápis: (Výběr více voleb
name="vyber[]"
. Vyžaduje jiné zpracování dat.)
< form action ="formular6plus.php" method ="post" name ="formular" >
< select name ="vyber[]" size ="6" >
< option > 1999 </ option >
< option > 2000 </ option >
< option > 2001 </ option >
< option > 2002 </ option >
< option > 2003 </ option >
< option > 2004 </ option >
< option > 2005 </ option >
</ select >
< input name ="jmenosubmit" type ="submit" value ="OK" > poslat
</ form >
Se zobrazí jako:
1999
2000
2001
2002
2003
2004
2005
poslat
Atributy:
size
kolik voleb se zobrazí
multiple
zda můžeme zvolit více voleb současně
Další atributy:
class
,
dir
,
disabled
,
id
,
lang
,
name
,
style
,
tabindex
,
title
a atributy událostí (
onBlur
,
onChange
,
onClick
,
onDblClick
,
onFocus
,
onKeyDown
,
onKeyPress
,
onKeyUp
,
onMouseDown
,
onMouseMove
,
onMouseOut
,
onMouseOver
,
onMouseUp
,
onSelect
.
14.
Značka option
Položka ve značce
select
.
Atributy:
selected
označená položka
value
hodnota, která se pošle na server
Příklad:
<option>2006</option>
pošle na server "
2006
"
<option value="prasátko">2006</option>
pošle na server "
prasátko
"
Zápis:
< form action ="formular6plus.php" method ="post" name ="formular" >
< select name ="vyber[]" size ="6" multiple >
< option value ="1999" > rok 1 </ option >
< option value ="2000" selected ="selected" > rok 2 </ option >
< option value ="2001" > rok 3 </ option >
< option value ="2002" selected ="selected" > rok 4 </ option >
< option value ="2003" selected ="selected" > rok 5 </ option >
< option value ="2004" > rok 6 </ option >
< option value ="2005" > rok 7 </ option >
</ select >
< input name ="jmenosubmit" type ="submit" value ="OK" > poslat
</ form >
Se zobrazí jako:
rok 1
rok 2
rok 3
rok 4
rok 5
rok 6
rok 7
poslat
Další atributy:
class
,
dir
,
disabled
,
id
,
label
,
lang
,
style
,
title
a atributy událostí (
onClick
,
onDblClick
,
onKeyDown
,
onKeyPress
,
onKeyUp
,
onMouseDown
,
onMouseMove
,
onMouseOut
,
onMouseOver
,
onMouseUp
,
onSelect
.
15.
Značka optgroup
Souhrn značek
option
ve značce
select
.
Zápis:
< form action ="formular6plus.php" method ="post" name ="formular" >
< select name ="vyber[]" size ="6" multiple >
< optgroup label ="minule" >
< option > 1997 </ option >
< option > 1998 </ option >
< option > 1999 </ option >
</ optgroup >
< optgroup label ="ted" >
< option > 2000 </ option >
< option > 2001 </ option >
< option > 2002 </ option >
< option > 2003 </ option >
</ optgroup >
</ select >
< input name ="jmenosubmit" type ="submit" value ="OK" > poslat
</ form >
Se zobrazí jako:
1997
1998
1999
2000
2001
2002
2003
poslat
Atributy:
label
zobrazený název skupiny voleb
Další atributy:
class
,
dir
,
disabled
,
id
,
label
,
lang
,
style
,
title
a atributy událostí (
onClick
,
onDblClick
,
onKeyDown
,
onKeyPress
,
onKeyUp
,
onMouseDown
,
onMouseMove
,
onMouseOut
,
onMouseOver
,
onMouseUp
,
onSelect
.