<FORM>


Hiermee begin je een formulier.

Hier staat waar de ingevoerde data heen gestuurd moet worden, dus tussen de <FORM> en de </FORM> komt het formulier.
 

Attribuut Resultaat
ACTION= hier wordt aangegeven wat er met de ingevulde gegevens moet gebeuren als de gebruiker op de verzenden knop klikt:
 
"mailto:mail@host.nl" zendt de gegevens naar een e-mail adres. Met deze methode wordt de data verzonden in een klein bestandje dat met het e-mail meegestuurd wordt. Deze methode werkt alleen als de bezoeker een browser met ingebouwd e-mail programma gebruikt en de instellingen van dat e-mail programma goed zijn.
"/cgi-bin/form2mail" zendt de gegevens naar een CGI script. Zo'n script kan bijvoorbeeld de gegevens netjes in een e -mailtje zetten in plaats van in een bestandje. Bijna elke Internet aanbieder heeft wel zo'n CGI script, al kan je ook altijd een script van een ander aanbieder gebruiken. Let er wel op dat er altijd extra parameters meegestuurd moeten worden. Dit verschilt per CGI script
METHOD= de methode van versturen van de data: post

 

<INPUT>


Definieer de invoervakken. De volgende attributen kunnen meegegeven worden:

 

Attribuut Resultaat
TYPE=
text invoervak voor één regel tekst
password invoervak voor één regel tekst, maar je kan niet zien wat er ingevoerd wordt
radio keuzerondje, meerdere radio's met dezelfde naam worden een array. Binnen een array kan er maar één optie geselecteerd worden
checkbox aankruisvakje
image aanklik baar plaatje: coördinaten van de plaats waar geklikt is worden geregistreerd. Alle gegevens worden direct verstuurd als er op het plaatje geklikt wordt!
hidden verborgen vak: VALUE stelt geregistreerde waarde in. Dit is handig voor bijvoorbeeld het adres van dit formulier. Je weet dan altijd waar dit ingevuld is
file bestand: hiermee kan je iemand een bestand mee laten sturen. Met VALUE kan je bepalen welk bestand als standaard ingevuld wordt. Je moet echter wel in de <FORM> tag de attributen ENCTYPE="multipart/form-data" en METHOD=post toevoegen. Dit element werkt in Netscape 2.0 en hoger, IE 3.02 met speciale upload patch en IE 4 en hoger.
submit Verzend knop: VALUE bepaalt wat er op de knop staat. Als er op deze knop gedrukt wordt, worden de gegevens verstuurd
reset Reset knop: VALUE bepaalt wat er op de knop staat. Als er op deze knop gedrukt wordt, worden alle gegevens in het formulier gewist
NAME="naam" naam van het invoervak
SIZE=n breedte van het invoervak in tekens, er kan wel langere tekst ingevoerd worden
MAXLENGTH=n maximale lengte van de ingevoerde tekst in tekens
VALUE="waarde" geeft aan welke waarde geregistreerd moet worden bij een radio of checkbox als deze aangekruist is. Bij een text of password een standaardwaarde die van tevoren ingevuld wordt
CHECKED radio of checkbox standaard aangekruist
SRC="plaatje.gif" de locatie van het bestand voor een image


 

Voorbeelden
* Voer hier uw naam in: <INPUT TYPE=text NAME="naam">
  Voer hier uw naam in:
* Voer uw wachtwoord in: <INPUT TYPE=password SIZE=20 NAME="wachtwoord">
  Voer uw wachtwoord in:
* Wat is uw geslacht: <INPUT TYPE=radio VALUE="man" NAME="geslacht"> Man <INPUT TYPE=radio VALUE="vrouw" NAME="geslacht"> Vrouw
  Wat is uw geslacht: Man Vrouw
* Kruis dit vakje aan als u e-mail wilt ontvangen <INPUT TYPE=checkbox NAME="e-mail" VALUE="ja" CHECKED>
  Kruis dit vakje aan als u e-mail wilt ontvangen
* <FORM ENCTYPE="multipart/form-data" METHOD=post ACTION="/cgi-bin/upload">Bestand dat u mee wilt sturen: <INPUT TYPE=file NAME="bestand" VALUE="bestand.txt"></FORM>
  Bestand dat u mee wilt sturen:
* <INPUT TYPE=reset VALUE="Reset"><INPUT TYPE=submit VALUE="Verzenden">
 


 

<TEXTAREA>tekst</TEXTAREA>


Definieert een invoervak voor meerdere regels. tekst is de tekst die standaard ingevuld wordt.

 

Attribuut Resultaat
NAME="naam" naam van het invoervak
COLS=n het aantal kolommen dat het invoervak breed moet zijn (standaard 40)
ROWS=n het aantal regels dat het invoervak hoog moet zijn (standaard 4)

 

Voorbeeld
Typ hier uw lof over deze pagina's: <TEXTAREA NAME="lof" ROWS=4 COLS=40>Heel goed!</TEXTAREA>
Typ hier uw lof over deze pagina's:


 

<SELECT>

Definieer een keuzelijst. Een keuzelijst is een lijst met opties waaruit gekozen kan worden.
 

Attribuut Resultaat
NAME="naam" de naam van de keuzelijst
SIZE=n het aantal opties in de lijst
MULTIPLE als dit toegevoegd wordt, wordt het mogelijk meerdere opties te selecteren
<OPTION>optietekst

Keuzelijst vullen met opties. optietekst is de tekst die in de lijst komt te staan.

 

Attribuut Resultaat
VALUE="waarde" de waarde die doorgegeven moet worden als deze optie geselecteerd is
SELECTED als dit toegevoegd wordt, is deze optie standaard geselecteerd
</SELECT>

Einde van de keuzelijst.
 

Voorbeeld
Kies hier uw locatie:
<SELECT NAME="locatie">
<OPTION VALUE="Nederland">Nederland
<OPTION VALUE="Europa">Ergens anders in Europa
<OPTION VALUE="Wereld">Ergens anders in de wereld
</SELECT>
Kies hier uw locatie:


 

</FORM>


Einde van het formulier.
 

Events (gebeurtenissen)


Aan elk formulier onderdeel kan je met behulp van een 'event' (gebeurtenis) een stukje Java Script koppelen:
<FORM>

    Event Betekenis
  onSubmit als het formulier verzonden wordt
  onReset als er op de Reset knop gedrukt wordt

<BUTTON>, <INPUT>, <SELECT> en <TEXTAREA>

    Event Betekenis
  onClick als het element aangeklikt wordt
  onFocus als het element de focus krijgt (JS 1.1)
  onBlur als het element de focus verliest (JS 1.1)
  onChange als de waarde van het element verandert
  onSelect als de ingevulde tekst in een element geselecteerd wordt

 

Ingevulde waarden controleren


In Java Script kan je de waarde van elk element opvragen op de volgende manier:
stel dat we het volgende formulier hebben:
 

<FORM NAME="Formulier1">
<INPUT TYPE=TEXT NAME="Tekstveld">
</FORM>

Dan staat de ingevulde waarde in de variabele document.Formulier1.Tekstveld.value.