Sisestuselement input
input-element loob erinevaid HTML-vormi elemente:
tavaline sisestusväli, parooli sisestusväli,
märkeruut (checkbox),
raadionupp (radio), nupp.
input-element peaks asuma
form-elemendi sees.
See pole kohustuslik, kuid on vajalik andmete saatmiseks
serverisse ja nende järgneks töötluseks
PHP kaudu.
Ei vaja sulgev elementi.
Atribuudid
| Atribuut | Kirjeldus |
|---|---|
type |
Määrab sisestusvälja tüübi. Valikud vt allpool. |
value |
Vaikeväärtus sisestusväljal. Nupu puhul määrab selle teksti.
Üksikasjalikumalt vt atribuuti value.
|
placeholder |
Vihje sisestusväljal, üksikasjalikumalt vt
atribuuti placeholder.
|
name |
Sisestusvälja nimi. Vajalik, et sisestusvälja andmeid PHP-s kätte saada. Vormi korrektseks toimimiseks ei tohiks sisestusväljade nimed üksteisega kattuda (ühes vormis). Kui need kattuvad - PHP-sse jõuavad andmed sellest sisestusväljast, mis on HTML-koodis allpool. |
disabled |
Blokeerib vormielemendi (mitte ainult input, vaid peaaegu iga),
üksikasjalikumalt vt atribuuti disabled.
|
Atribuudi type väärtused
| Väärtus | Kirjeldus |
|---|---|
text |
Loob tavalise tekstisisestusvälja. |
password |
Loob tekstisisestusvälja parooli jaoks. Proovige sinna teksti sisestada - see kuvatakse tärnidena. |
checkbox |
Loob märkeruudu (checkbox).
Üksikasjalikumalt vt checkbox.
|
radio |
Loob raadioknöpnu (radio).
Üksikasjalikumalt vt radio.
|
hidden |
Loob peidetud inputi, mis ei ole ekraanil nähtav, kuid saadab serverisse
atribuudis value sisalduvad andmed.
|
button |
Loob nupu. Selle nupu vajutamine
ei saa vormi serverisse. Seda saab kasutada
lingi sees või JavaScript kaudu.
Vaikimisi pole nupul teksti (näide nupust ilma tekstita: ),
see määratakse atribuudiga value.
Vaata ka elementi button,
mis loob samuti nupu.
|
submit |
Loob nupu, mis saadab andmed serverisse.
Nupu tekst sõltub brauserist, seda saab muuta
atribuudiga value.
Vaata ka elementi button,
mis loob samuti nupu.
|
reset |
Loob nupu, mis tühjendab täidetud vormi.
Nupu tekst sõltub brauserist, seda saab muuta
atribuudiga value.
|
file |
Loob faili valimise nupu. Selle nupu disaini ei tohi muuta
CSS-i kaudu (kuid on olemas keerulised viisid). Kui teil on vaja sellist välja vormis, siis
form-element peab omama atribuuti
enctype väärtusega multipart/form-data.
|
Uued HTML5-s atribuudi type väärtused
Need atribuudi väärtused on uued, ilmusid alles HTML5-s, seega mõnes brauseris need ei pruugi toimida või toimivad erinevalt erinevates brauserites.
Juhul, kui brauser ei suuda atribuudi
type sisust aru saada
(näiteks kui seda ei toetata või on see valesti sisestatud),
peab ta elementi tavaliseks tekstisisestusväljaks,
nagu oleks type väärtuseks
text.
Vaadake allolevaid näiteid
erinevates brauserites. Proovige sisestada
inputitesse teksti ja vajutada saatmise nuppu.
Kui tekst on sobimatu või väli on tühi -
annab brauser veateate. Näiteks kui
tüübiga email väljale sisestada sobimatu
e-posti aadress - brauser ei luba vormi saata ja
annab veateate (vea teksti
ja selle välimust HTML-i ega CSS-i abil muuta ei saa).
Kui väli on tühi - annab brauser samuti vea,
see saavutatakse atribuudi required abil:
| Väärtus | Kirjeldus |
|---|---|
email |
|
number |
|
url |
|
tel |
|
search |
|
color |
|
date |
|
month |
|
week |
|
datetime |
|
datetime-local |
|
range |