Hoe werkt een internet formulier?

Het gebruik van een internet formulier maakt je leven een stuk gemakkelijker. Het stelt je in staat om te communiceren met je bezoekers, informatie te verzamelen en daarmee in je bedrijf allerlei werkprocessen aan te sturen. De grens tussen een website en software wordt daarmee soms moeilijk aan te geven.
Het eerste formulier dat de meeste mensen op een website plaatsen is het contactformulier. Ben je benieuwd waaraan zo'n formulier het beste kan voldoen? Lees dan mijn eerdere artikel over richtlijnen voor een contactpagina.

Hoe werkt een formulier op internet?
Met speciale code kan je een HTML formulier maken. De informatie die je bezoeker hierin invult wordt naar een server gestuurd. Deze kan er iets mee doen en vervolgens erop reageren. Dit ziet er ongeveer zo uit:

Het is hierbij niet zo dat de verbinding met de website constant is. Bij elke pagina wordt deze opnieuw gelegd! Dat kan lastig zijn als je meerdere stappen hebt in een formulier. Maar hiervoor zijn allerlei oplossingen bedacht, zoals cookies en sessies. Hierop zal ik in een later artikel terugkomen.

POST en GET methode
Voor het versturen van een formulier zijn er 2 manieren (methodes): POST en GET. De eerste raad ik je aan te gebruiken, omdat dit er speciaal voor gemaakt is. Het verschil zit in de codering van de data die je verstuurt.

Met GET verstuur je informatie via het internet adres: de URL. Een URL heeft een beperkte lengte, dus op een gegeven moment zit deze vol. Bovendien moet je extra inspanningen verrichten om alle karakters goed via een URL door te geven weer te ontcijferen. Bijvoorbeeld: naam=Theo%20Bakker is de weergave van 'Theo Bakker' in een URL. De HTML code is voor dit type formulier:

Met POST verstuur je de informatie in de inhoud van een bericht (de body). Hieronder zie je een voorbeeld van de elementen die met het formulier van de NS verstuurd worden bij het opzoeken van treintijden:

Zoals je kunt zien verstuurt dit formulier informatie over stations en reistijden, maar ook over het internetadres waar je vandaag bent gekomen en een XML pakket met daarin de reisgegevens. De HTML code is voor dit type formulier:

Wel of geen afbeeldingen versturen in het formulier
Als je in een formulier afbeeldingen wilt versturen, moet je je formulier anders coderen. Als je niets opgeeft wordt het formulier automatisch verstuurd via application/x-www-form-urlencoded. Als je bestanden en foto's wilt versturen (dus uploads), gebruik dan multipart/form-data. Het verschil in de code is:

De actie van een formulier
Naast methode en encryptie type geef je aan een formulier ook een actie op. Dit vertelt het formulier waar het heen verstuurd moet worden. In dit voorbeeld wordt het formulier verstuurd naar een bedankpagina:

Hoe nu verder?
Hierna moet je formulier vullen met formulier elementen (controls). Hierover binnenkort meer!

Meer lezen
De officiële documentatie van het W3C over formulieren.