Als je informatie van de lezers van een website wil loskrijgen, is het vaak handig om alvast een aantal opties te geven waaruit ze kunnen kiezen. De lezer hoeft dan minder te typen, en de kans dat jouw formulier zal ingevuld worden, is groter. Een selectievakje is een invoerveld voor tekst, met dit verschil dat het hier om een ander type gaat:
<input type="chekbox" name="veldnaam">
De veldnaam is een unieke naam voor het invoerveld. Indien je het vakje standaard afgevinkt wil weergeven, kan je het attribuut checked meegeven. Het volgende voorbeeld toont een lijst met een aantal kleurnamen. het eerste selectievakje is alvast door de programmeur geslecteerd:
<form>
<h1>welke kleuren vind je mooi?</h1><br>
<input type="checkbox" name="groen" checked>groen<br>
<input type="checkbox" name="geel">geel<br>
<input type="checkbox" name="rood">rood<br>
<input type="checkbox" name="blauw">blauw<br>
<\form>
In plaats van vakjes die de lezer allemaal kan afvinken, wil je misschien dat de bezoeker een keuze maakt uit verschillende mogelijkheden. In dat geval maak je gebruik van keuzerondjes, die ook bekend staan onder hun Engelse naam: radio buttons. Bij keuzerondjes kan de gebruiker één keuze maken uit een aantal mogelijkheden. Indien je een lijst met zes selectievakjes onder elkaar hebt staan, kan de lezer deze, indien gewenst, alle zes afvinken. heb je een lijst met zes keuzerondjes, dan kan de lezer maar één van de zes rondjes kiezen. Als rondje 1 is geslecteerd, en de lezer klikt op rondje 6, dan wordt dit rondje geselecteerd, en de selectie van rondje 1 automatisch opgeheven. Dit effect bereik je door alle keuzerondjes in de lijst dezelfde naam te geven. De browser weet dan dat de rondjes tot dezelfde groep behoren. Om toch af te kunnen leiden welk rondje de lezer heeft gekozen, geef je elk rondje een andere waarde met het attribuut value:
<form>
<h1>welk kleur zie je het liefst?</h1><br>
<input type="radio" name="geslacht" value=groen >groen<br>
<input type="radio" name="geslacht" value=geel>geel<br>
<input type="radio" name="geslacht" value=rood
checked>rood<br>
<input type="radio" name="geslacht" value=blauw>blauw<br>
<\form>
Met het attribuut checked is ook hier alvast een standaardkeuze gemaakt.
Het wachtwoordveld lijkt in alle opzichten op een tekstveld. Er is eigenlijk maar één verschil. Wanneer de gebruiker een tekst invoert in een zo’n veld, ziet hij iet de eigenlijke tekst verschijnen, maar sterretjes. Dit wil niet zeggen dat dit veilig is want alles wat de lezer hier intikt, wordt gewoon, ongecodeerd over het Internet verzonden.
<input type="password" name="wachtwoord">
Voeg er liefst een tekstje voor, zodat je meer dan een invoervakje krijgt op je scherm.
De lengte van de invoer van tekstvelden is ‘beperkt’ tot 32.000 tekens (tenzij je het attribuut maxlengt gebruikt), maar op één regel is informatie langer dan een paar woorden moeilijk leesbaar. Daarom kan je gebruik maken van de aparte containertag <textarea>. De attributen cols en rows geven aan uit hoeveel rijen en kolommen het tekstveld bestaat.
<textarea name="opmerkingen" cols="40" rows="10>hiertussen kan je al dan niet willekeurige tekst plaatsen</textarea>
Keuzerondjes (radio buttons) vormen een prima manier om multiple-choice-vragen te
stellen als deze niet meer dan vier of vijf opties hebben. Bij meer dan dat wordt het
onpraktisch. In zo’n geval kan je beter een keuzelijst (selection list) aanmaken. De
basisstructuur is als volgt
<select name="lijstnaam" size="aantal items dat je wil zien">
<option>eerste optie</option>
<option>tweede optie</option>
<option>derde optie</option>
<option>vierde optie</option>
</select>
De lijstnaam is een unieke naam voor de lijst. Het attribuut size is optioneel. Als je dit weglaat, wordt de lijst weergegeven als een drop-down-lijst. Indien je wil hebben dat de lezer meer dan één mogelijkheid heeft om aan te klikken (door het indrukken van de CTRL-toets) dan moet je het attribuut multiple meegeven in de tag <select>.