Input-tag
Die input-tag skep verskeie elemente
van 'n HTML-vorm: 'n gewone invoerveld, 'n veld vir
wagwoordinvoer, 'n merkbox (checkbox),
radioknoppies (radio), 'n knoppie.
Die input-tag moet binne die
form-tag wees.
Dit is nie verpligtend nie, maar wel nodig vir die stuur
van data na die bediener en die daaropvolgende verwerking daarvan
deur PHP.
Vereis nie 'n sluitingsetiket nie.
Eienskappe
| Eienskap | Beskrywing |
|---|---|
type |
Spesifiseer die tipe invoerveld. Sien opsies hieronder. |
value |
Die verstekwaarde in die invoerveld. In die geval van 'n knoppie, spesifiseer dit die teks daarop.
Sien meer details by die eienskap value.
|
placeholder |
Wenk in die invoerveld, sien meer details by
die eienskap placeholder.
|
name |
Die naam van die invoerveld. Nodig om die veld se data in PHP te kan kry. Vir korrekte werking van die vorm mag die name van invoervelde nie met mekaar ooreenstem nie (in een vorm). As hulle ooreenstem - sal in PHP die data van die invoerveld wat laer in die HTML-kode is, aankom. |
disabled |
Blokkeer die vormelement (nie net input nie, maar feitlik enige),
sien meer details by die eienskap disabled.
|
Waardes van die type-eienskap
| Waarde | Beskrywing |
|---|---|
text |
Skep 'n gewone teksinvoerveld. |
password |
Skep 'n teksinvoerveld vir 'n wagwoord. Probeer om teks daarin in te voer - dit sal as sterretjies vertoon word. |
checkbox |
Skep 'n merkbox (checkbox).
Sien meer details by checkbox.
|
radio |
Skep 'n radio-skakelaar.
Sien meer details by radio.
|
hidden |
Skep 'n verborge invoerveld wat nie op die skerm gesien sal word nie, maar wel die data wat
in die eienskap value bevat is, na die bediener sal stuur.
|
button |
Skep 'n knoppie. Om op hierdie knoppie te druk
sal nie die vorm na die bediener stuur nie. Dit kan binne
'n skakel of deur JavaScript gebruik word.
Standaard het die knoppie geen teks nie ('n voorbeeld van 'n knoppie sonder teks: ),
dit word gespesifiseer met behulp van value.
Sien ook die etiket button,
wat ook 'n knoppie skep.
|
submit |
Skep 'n knoppie wat data na die bediener sal stuur.
Die knoppie se teks hang van die blaaier af, dit kan verander word
met behulp van value.
Sien ook die etiket button,
wat ook 'n knoppie skep.
|
reset |
Skep 'n knoppie wat die ingevulde vorm skoonmaak.
Die knoppie se teks hang van die blaaier af, dit kan verander word
met behulp van value.
|
file |
Skep 'n knoppie om 'n lêer te kies. Die ontwerp van hierdie knoppie mag nie verander word nie
deur CSS (maar daar is slinkse maniere). As jy so 'n veld in 'n vorm benodig, moet die
etiket form die eienskap
enctype hê met die waarde multipart/form-data.
|
Nuwe HTML5-waardes vir die type-eienskap
Hierdie waardes van die eienskap is nuut, het eers verskyn in HTML5, dus in sommige blaaiers kan hulle dalk nie werk of verskillend werk in verskillende blaaiers.
In die geval dat die blaaier nie die inhoud van
die eienskap type kan verstaan nie
(bv. as dit nie ondersteun word of verkeerd ingevoer is),
sal dit die element as 'n gewone teksinvoerveld beskou,
asof die type die waarde
text het.
Kyk na die voorbeelde hieronder in
verskillende blaaiers. Probeer om
in die invoervelde teks in te voer en op die stuurknop te druk.
As die teks ongeldig is of die veld leeg is -
sal die blaaier 'n fout gee. Byvoorbeeld, as in
'n veld met tipe email 'n ongeldige
email ingevoer word - sal die blaaier nie toelaat om die vorm te stuur nie en
sal 'n foutboodskap gee (die teks van die fout
en die voorkoms daarvan kan nie met html css verander word nie).
As die veld leeg is - sal die blaaier ook 'n fout gee,
dit word bereik met behulp van die eienskap required:
| Waarde | Beskrywing |
|---|---|
email |
|
number |
|
url |
|
tel |
|
search |
|
color |
|
date |
|
month |
|
week |
|
datetime |
|
datetime-local |
|
range |
