Input tags
Tags input izveido dažādus HTML formas
elementus: parastu ievades lauku, paroles
ievades lauku, atzīmjoslas rūtiņu checkbox (čekboks),
radio pogas (radio), pogu.
Tags input jāatrodas iekšā tagā
form.
Tas nav obligāti, bet nepieciešams, lai nosūtītu
datus uz serveri un tos turpmāk apstrādātu
caur PHP.
Nepieprasa noslēdzošo tagu.
Atribūti
| Atribūts | Apraksts |
|---|---|
type |
Norāda ievades lauka tipu. Varianti skatīt zemāk. |
value |
Noklusējuma vērtība ievades laukā. Pogas gadījumā norāda tās tekstu.
Sīkāk skatīt atribūtu value.
|
placeholder |
Padoms ievades laukā, sīkāk skatīt
atribūtu placeholder.
|
name |
Ievades lauka nosaukums. Nepieciešams, lai iegūtu ievades lauka datus PHP. Lai forma darbotos korekti, ievades lauku nosaukumi nedrīkst sakrist viens ar otru (vienā formā). Ja tie sakrīt - PHP nonāks tie ievades lauka dati, kas atrodas zemāk HTML kodā. |
disabled |
Bloķē formas elementu (ne tikai input, bet gandrīz jebkuru),
sīkāk skatīt atribūtu disabled.
|
Atribūta type vērtības
| Vērtība | Apraksts |
|---|---|
text |
Izveido parastu teksta ievades lauku. |
password |
Izveido teksta ievades lauku parolei. Mēģiniet ievadīt tajā tekstu - tas tiks parādīts kā zvaigznītes. |
checkbox |
Izveido atzīmjoslas rūtiņu čekboks.
Sīkāk skatīt checkbox.
|
radio |
Izveido radio pārslēgšanas pogu.
Sīkāk skatīt radio.
|
hidden |
Izveido slēptu input, kas nebūs redzams ekrānā, bet nosūtīs atribūtā
value ietvertos datus uz serveri.
|
button |
Izveido pogu. Šīs pogas nospiešana
nesūtīs formu uz serveri. To var izmantot iekšā
saites vai caur JavaScript.
Pēc noklusējuma pogai nav teksta (piemērs pogas bez teksta: ),
to norāda, izmantojot value.
Skatīt arī tagu button,
kas arī izveido pogu.
|
submit |
Izveido pogu, kas nosūtīs datus uz serveri.
Pogas teksts ir atkarīgs no pārlūkprogrammas, to var mainīt
ar value palīdzību.
Skatīt arī tagu button,
kas arī izveido pogu.
|
reset |
Izveido pogu, kas notīra aizpildīto formu.
Pogas teksts ir atkarīgs no pārlūkprogrammas, to var mainīt
ar value palīdzību.
|
file |
Izveodo faila izvēles pogu. Šīs pogas dizainu aizliegts mainīt
caur CSS (tomēr ir viltīgi veidi). Ja jums ir nepieciešams šāds lauks formā, tad
tagam form jābūt atribūtam
enctype ar vērtību multipart/form-data.
|
Jaunās HTML5 atribūta type vērtības
Šīs atribūta vērtības ir jaunas, parādījās tikai HTML5, tāpēc dažās pārlūkprogrammās tās var nedarboties vai darboties atšķirīgi dažādās pārlūkprogrammās.
Ja pārlūkprogramma nespēj saprast atribūta
type saturu (piemēram, ja tas
netiek atbalstīts vai ir kļūdaini ievadīts),
tā uzskatīs elementu par parastu teksta
input, it kā type būtu vērtība
text.
Apskatiet zemāk norādītos piemērus
dažādās pārlūkprogrammās. Mēģiniet ievadīt
inputos tekstu un nospiest uz sūtīšanas pogas.
Ja teksts ir nekorekts vai lauks ir tukšs -
pārlūkprogramma izvadīs kļūdu. Piemēram, ja
laukā ar tipu email ievada nekorektu
e-pastu - pārlūkprogramma neļaus nosūtīt formu un
izvadīs kļūdas ziņojumu (kļūdas tekstu
un tās izskatu uz html css mainīt nevar).
Ja lauks ir tukšs - pārlūkprogramma arī izvadīs kļūdu,
to panāk ar atribūta required palīdzību:
| Vērtība | Apraksts |
|---|---|
email |
|
number |
|
url |
|
tel |
|
search |
|
color |
|
date |
|
month |
|
week |
|
datetime |
|
datetime-local |
|
range |
