Handleiding HTML - Beschrijving INPUT element

INPUT	Inhoud Handleiding HTML Overzicht elementen

Van het INPUT element worden de volgende attributen beschreven: TYPE, NAME, VALUE, CHECKED, SIZE, MAXLENGTH, SRC, ALT, ALIGN, USEMAP, ISMAP, DISABLED, READONLY, TABINDEX en ACCESSKEY.

De beschrijving van de attributen STYLE, CLASS, ID, TITLE, LANG en DIR is opgenomen in het onderdeel Algemene attributen.

Een overzicht van attributen, die betrekking hebben op het uitvoeren van een script bij het optreden van een bepaalde gebeurtenis, wordt gegeven in het onderdeel Gebeurtenis-attributen.

Het gebruik van het INPUT element wordt toegelicht in het onderdeel Formulieren in de Handleiding HTML.

INPUT

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Met het INPUT element wordt een veld in een formulier gedefinieerd, waarin de gebruiker gegevens kan invoeren. Bij de invoer kan het ondermeer gaan om een enkele regel tekst, een selectie met behulp van keuzerondjes en aankruisvakjes en opdrachten tot het verzenden van de ingevoerde of geselecteerde informatie, of het herstellen van de beginwaarden.
De opbouw is:

<INPUT ..>

Het INPUT element heeft alleen attributen en geen inhoud. Een beëndiging is daarom niet toegestaan.
Voor de verwerking van het formulier zal meestal het NAME attribuut vereist zijn.

TYPE

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Met het TYPE attribuut wordt bepaald wat voor soort gegevens het invoerveld accepteert.
De opbouw is:

<INPUT TYPE="waarde">

De volgende waarden zijn beschikbaar:

text: hiermee wordt een veld gedefinieerd waarin de gebruiker een enkel woord of een enkele regel tekst kan invoeren. Met behulp van het VALUE attribuut kan een standaard tekst worden opgegeven, welke in het veld staat als het formulier geopend wordt. Andere attributen welke gebruikt kunnen worden zijn SIZE en MAXLENGTH.
password: hiermee wordt een veld gedefinieerd waarin de gebruiker gevoelige tekst (bijvoorbeeld een wachtwoord) kan invoeren. De ingevoerde karakters worden met een asterix (*) weergegeven. Met behulp van het VALUE attribuut kan een standaard wachtwoord worden opgegeven, welke in het veld staat als het formulier geopend wordt. Andere attributen welke gebruikt kunnen worden zijn SIZE en MAXLENGTH.
checkbox: hiermee wordt een aankruisvakje gedefinieerd. De gebruiker kan het vakje selecteren (aankruisen) als hij/zij het met de bijbehorende omschrijving eens is. Met behulp van het verplichte VALUE attribuut wordt bepaald welke waarde (in combinatie met de waarde van het NAME attribuut) naar de server gestuurd moet worden als het aankruisvakje geselecteerd is. Met het CHECKED attribuut kan een standaard keuze aangegeven worden. Van een eenmaal geselecteerd aankruisvakje kan de selectie ongedaan gemaakt worden door het nogmaals aan te klikken.
radio: hiermee wordt een keuzerondje gedefinieerd welke deel uit maakt van een set van keuzerondjes waarvan de gebruiker er één kan kiezen. Door middel van het verplichte VALUE attribuut wordt bepaald welke informatie naar de server verzonden moet worden. Bij elkaar behorende keuzerondjes krijgen behulp met het NAME attribuut dezelfde naam. Het is aan te bevelen met behulp van het CHECKED attribuut een standaard keuze te aan te geven. Als een keuzerondje eenmaal geselecteerd is, kan de selectie alleen ongedaan gemaakt worden als een ander keuzerondje met dezelfde naam geselecteerd wordt. Keuzerondjes pas je toe als het aantal keuzemogelijkheden niet al te groot is. Bij meer dan 3 à 4 keuzemogelijkheden is het beter gebruik te maken van een uitschuifkeuzelijst, welke opgebouwd wordt met de elementen SELECT en OPTION.
submit: hiermee wordt een knop gedefinieerd, die er voor zorgt dat, als erop wordt geklikt, de ingevoerde gegevens van het formulier naar de server worden verstuurd. Met behulp van het VALUE attribuut kan de tekst bepaald worden, welke op de knop moet staan. Als het VALUE attribuut niet is gebruikt, wordt "Submit Query" afgebeeld. Eventueel kan ook het NAME attribuut gebruikt worden. Je kunt dan meerdere SUBMIT knoppen naast elkaar gebruiken in plaats keuzerondjes. Dit heeft alleen zin als de invoer zich tot deze knoppen beperkt, omdat anders ook alle overige informatie met het klikken op de knop verzonden wordt.
reset: hiermee wordt een knop gedefinieerd, die bij klikken de beginwaarden van de verschillende controls herstelt (en dus ook alle ingevoerde tekst wist). Met behulp van het VALUE attribuut kan de tekst bepaald worden, welke op de knop moet staan. Als het VALUE attribuut niet is gebruikt, wordt "Reset" afgebeeld.
button: hiermee wordt een knop gedefinieerd, die er voor zorgt dat, als erop wordt geklikt, een script wordt uitgevoerd. Met behulp van het VALUE attribuut kan de tekst bepaald worden, welke op de knop moet staan.
image: hiermee kan een afbeelding gebruikt worden als een knop. Omdat de afbeelding in plaats van de echte knop komt, zal het in het algemeen niet meer gaan om iets wat er uitziet als een knop (in tegenstelling tot bij de oplossing via het BUTTON element). Behalve de overige informatie van het formulier worden ook de coördinaten van de plaats waar geklikt wordt meegestuurd. Met behulp van het SRC attribuut moet bepaald worden welke afbeelding weergegeven moet worden. Met het ALT attribuut wordt een alternatieve tekst opgegeven, voor als de browser geen afbeeldingen kan of mag weergeven. Omdat niet elke browser al met het ALT attribuut overweg kan, is het verstandig ook het NAME attribuut op te nemen met de alternatieve tekst. Als het NAME attribuut gebruikt is, dan wordt deze aan de coördinaten toegevoegd (naam.x en naam.y) bij het verzenden naar de server.
hidden: hiermee wordt een verborgen (voor de gebruiker niet zichtbaar) veld gedefinieerd. De door middel van het VALUE attribuut bepaalde inhoud wordt met de overige informatie van het formulier verzonden naar de server.
file: hiermee wordt de gebruiker gevraagd een bestand op te geven, dat met de overige informatie uit het formulier naar de server gestuurd moet worden. De waarde file wordt ondersteund door Netscape Navigator vanaf versie 2 en Microsoft Internet Explorer vanaf versie 3. Als van deze mogelijkheid gebruik gemaakt wordt, moet aan het FORM element wel het ENCTYPE attribuut met de waarde "multipart/form-data" toegevoegd worden.

De standaardwaarde voor het TYPE attribuut is text.

NAME

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Het NAME attribuut wordt gebruikt om een invoerveld een naam te geven en daarmee het CGI-script in staat te stellen het te onderscheiden van andere controls van het formulier.
De opbouw is:

<INPUT NAME="naam">

VALUE

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Het VALUE attribuut heeft een betekenis die afhangt van waarde aan het TYPE attribuut is gegeven:

bij "text" en "password" bepaalt het de standaard tekst welke in het invoerveld wordt weergegeven.
bij "hidden" bepaalt het de waarde welke onzichtbaar voor de gebruiker wordt meegezonden naar de server.
bij "radio" en "checkbox" bepaalt het welke waarde naar de server gestuurd moet worden als de mogelijkheid geselecteerd is.
bij "submit" en "reset" bepaalt het de tekst welke op de knop komt te staan.

De opbouw is:

<INPUT VALUE="waarde">

Indien het TYPE attribuut de waarde "radio" heeft, moet het VALUE attribuut gebruikt worden.

CHECKED

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Met het CHECKED attribuut wordt bij de waarden "radio" en "checkbox" voor het TYPE attribuut een standaardkeuze aangegeven.
De opbouw is:

<INPUT TYPE="checkbox" CHECKED>

of

<INPUT TYPE="radio" CHECKED>

SIZE

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Met het SIZE attribuut wordt bij de waarden "text" en "password" voor het TYPE attribuut bepaald hoe breed (uitgedrukt in het aantal karakters) het veld op het scherm moet worden weergegeven. Het SIZE attribuut heeft geen invloed op de hoeveelheid tekst die de gebruiker kan intoetsen. De tekst in de invoervelden wordt weergegeven in een lettertype met een vaste letterafstand. Als het SIZE attribuut niet wordt gebruikt dan wordt als standaard 20 karakters aangehouden.
Bij de overige waarden voor het TYPE attribuut wordt de breedte uitgedrukt in pixels.
De opbouw is:

<INPUT SIZE="waarde">

MAXLENGTH

HTML	2.0
NN	1.0
MSIE	1.0
OP	2.1

Met het MAXLENGTH attribuut wordt bij de waarden "text" en "password" voor het TYPE attribuut bepaald hoeveel karakters de gebruiker kan intoetsen.
De opbouw is:

<INPUT MAXLENGTH="waarde">

De waarde is een getal.

SRC

HTML	2.0
NN	1.1
MSIE	1.0
OP	2.1

Met het SRC attribuut wordt bij de waarde "image" voor het TYPE attribuut bepaald, welke afbeelding moet worden weergegeven als grafische "submit" knop.
De opbouw is:

<INPUT TYPE="image" SRC="URI">

De URI (Uniform Resource Identifier) heeft de volgende opbouw:

http://host/path

Host specificeert het adres van de server, waarop zich de gevraagde afbeelding bevindt. Het kan een IP-adres zijn, maar meestal is het de naam van de machine. Een machinenaam (ook wel domeinnaam) bestaat uit meerdere delen gescheiden door een punt, begint vaak met "www" en eindigt met een landcode (bijvoorbeeld "nl", "be", "uk") of de vooral in de Verenigde Staten gebruikte code voor de sector (bijvoorbeeld "com" voor commerciële instellingen en "org" voor non-profit organisaties).
Path geeft aan hoe de gevraagde afbeelding op de server gevonden kan worden: in welke directory en onder welke bestandsnaam.

Het is niet altijd nodig een complete URI op te nemen. Als de gevraagde afbeelding zich op de lokale server bevindt, dan volstaat de volgende URI:

path

ALT

HTML	2.0
NN	1.1
MSIE	1.0
OP	2.1

Met het ALT attribuut kan bij de waarde "image" voor het TYPE attribuut een alternatieve tekst opgegeven worden, voor als de browser de afbeelding niet kan weergeven (bij gebruik van een tekst-georiënteerde browser).
De opbouw is:

<INPUT TYPE="image" SRC="bestemming" ALT="alternatieve tekst">

ALIGN

HTML	2.0
NN	1.1
MSIE	1.0
OP	2.1

Met het ALIGN attribuut wordt bij het waarde "image" voor het TYPE attribuut de verticale uitlijning van de afbeelding bepaald.
De opbouw is:

<INPUT TYPE="image" SRC="bestemming" ALIGN="uitlijning">

Voor de mogelijkheden voor de uitlijning zie de beschrijving van het IMG element.

USEMAP

HTML	4.0
NN	-
MSIE	-
OP	-

De door de server te ondernemen actie kan afhankelijk gemaakt worden van de coördinaten van het punt waarop geklikt wordt in de via het SRC attribuut opgegeven afbeelding. Het USEMAP attribuut wordt in dat geval gebruikt om te specificeren in welke "map" de bij de afbeelding behorende gegevens gevonden kunnen worden.
De opbouw is:

<INPUT TYPE="image" SRC="URI_afbeelding" USEMAP="URI_map#map_naam">

Voor een toelichting op de URI zie het SRC attribuut.
Als de map-gegevens in hetzelfde document wordt opgenomen, is het voldoende alleen de naam van de map op te geven:

USEMAP="#map_naam"

Voor meer informatie zie de beschrijving van Client-side image maps.

ISMAP

HTML	4.01
NN	-
MSIE	-
OP	-

Het ISMAP attribuut geeft aan dat de afbeelding een zogenaamde "server-side image map" is, ofwel een aanklikbare afbeelding waarvan de werking gecontroleerd wordt door (een cgi-script op) de server. De aanklikbare afbeelding is opgedeeld in verschillende gebieden. Als je op de afbeelding klikt, worden de coördinaten van de plaats op de afbeelding waar je klikt naar het (via het ACTION attribuut van het FORM element opgegeven) cgi-script op de server verstuurd. Op basis van de coördinaten bepaalt het cgi-script op welk gebied je hebt geklikt en wat de bijbehorende actie is.
De opbouw is:

<INPUT TYPE="image" SRC="URI_afbeelding" ISMAP>

DISABLED

HTML	4.0
NN	-
MSIE	4.0
OP	-

Met het DISABLED attribuut kan aangegeven worden dat de gebruiker niets mag invoeren in het betreffende veld.
De opbouw is:

<INPUT DISABLED>

Een INPUT element met het attribuut DISABLED krijgt geen focus als de gebruiker er op klikt, wordt overgeslagen in de tab-reeks en de waarde van het element wordt niet meegezonden met de rest van het formulier.

READONLY

HTML	4.0
NN	-
MSIE	4.0
OP	-

Indien het TYPE attribuut de waarde "text" of "password" heeft, kan met het READONLY attribuut bepaald worden dat de tekst, welke met het VALUE attribuut in het tekstveld is geplaatst, niet gewijzigd mag worden.
De opbouw is:

<INPUT VALUE="tekst" READONLY>

TABINDEX

HTML	4.0
NN	-
MSIE	4.0
OP	-

Met het TABINDEX attribuut kan de volgorde bepaald worden, waarmee verschillende onderdelen van een document (hyperlinks, gebieden van een client-side image map en controls van een formulier) de focus kunnen krijgen (geactiveerd kunnen worden) als de gebruiker de tab-toets op het toetsenbord indrukt.
De opbouw is:

<INPUT TABINDEX="waarde">

De waarde mag een positief of negatief geheel getal (integer) zijn.
De normale tab-volgorde is de volgorde waarin de elementen in het document voorkomen. Elementen waarvoor het TABINDEX attribuut gebruikt is, komen voor elementen zonder het TABINDEX attribuut. Elementen met een positieve waarde voor de TABINDEX worden doorlopen van de laagste waarde naar de hoogste waarde. Een element met een negatieve waarde voor de TABINDEX doet niet mee in de tab-volgorde. Hetzelfde geldt voor elementen met het DISABLED attribuut.

ACCESSKEY

HTML	4.0
NN	-
MSIE	4.0
OP	-

Het ACCESSKEY attribuut kan gebruikt worden om een sneltoets aan het INPUT element toe te wijzen en daarmee de gebruiker direct vanaf het toetsenbord toegang te geven tot het control, dat door het element in het formulier is geplaatst. Gebruik van de sneltoets geeft het control de focus (activeert het), waarna de gebruiker bijvoorbeeld in het geval van een tekstveld tekst kan invoeren.
De opbouw is:

<INPUT ACCESSKEY="waarde">

De waarde is een enkel, case-insensitive (geen onderscheid tussen hoofd- of kleine letters) karakter uit het karakterset van de browser. In Windows moet de toets van het karakter ingedrukt worden in combinatie met de Alt-toets, op Apple systemen in combinatie van de Cmd-toets.
Om de gebruiker attent te maken van de sneltoets is het verstandig deze in de tekst of een label te vermelden.

In grijs weergegeven attributen zijn niet beschreven in deze handleiding.

Inhoud Handleiding HTML Index Overzicht elementen