De basissyntax voor een formulier is: <FORM ACTION="[URL]">...</FORM>
Als een formulier wordt ingezonden ('submitted'), worden de formuliergegevens verzonden naar de URL die is opgegeven in het ACTION-attribuut. Deze URL moet verwijzen naar een programma op de server (bijv. een CGI-programma) die de formuliergegevens zal verwerken. Het formulier zelf moet bevatten
<INPUT TYPE="submit" ...>-element),Een uitgebreidere uitleg van het gebruik van formulieren is te vinden op <URL:http://mirror.subotnik.net/jkorpela/forms/>. Als je CGI-programma's op je server wilt installeren, zijn dit nuttige bronnen:
De enige betrouwbare methode voor het verwerken van formulierinzendingen is een programma op de server (bijv. een CGI-programma). Om formuliergegevens naar jezelf toegemaild te krijgen, moet je een server-side programma gebruiken dat de formulierinzendingen verwerkt en de gegevens naar jouw email-adres toestuurt.
Web-dienstverleners (ISP's) hebben vaak standaard form-to-email programma's beschikbaar voor hun klanten. Vraag je eigen ISP naar de details.
Als je CGI-programma op je eigen server kan installeren, kijk dan bij het antwoord op de vorige vraag voor een lijst met nuttige hulpmiddelen.
Als je geen CGI-programma's op je eigen server mag draaien, kun je een op afstand beheerde form-to-email dienst gebruiken. Een lijst met zulke dienstverleners is te vinden op <URL:http://www.cgi-resources.com/Programs_and_Scripts/Remotely_Hosted/Form_Processing/>. Merk op dat de aanbieder van een op afstand beheerde dienst toegang zal hebben tot alle gegevens die met de dienst worden ingezonden.
Formulieren die gebruikmaken van ACTION="mailto:..." zijn onbetrouwbaar. Mogelijk werken ze voor sommige van je gebruikers, maar ze mislukken voor anderen die afwijkende software configuraties hebben.
Kleine formulieren worden soms binnen een TD-element in een tabel gezet. Dit kan nuttig zijn voor het plaatsen van een formulier ten opzichte van andere inhoud, maar het helpt niet bij plaatsen van de formulier-items ten opzichte van elkaar.
Om formulieren-items ten opzichte van elkaar te plaatsen, moet de gehele tabel zich binnen het formulier bevinden. Je kunt niet een formulier beginnen in het ene TH- of TD-element en eindigen in een andere. Je kunt geen formulier in een tabel plaatsen zonder het binnen een TH- of TD-element te zetten. Je kunt wel de tabel binnen in het formulier zetten, en dan de tabel gebruiken om de INPUT-, TEXTAREA-, SELECT- en andere formulier-items te plaatsen, zoals in het volgende voorbeeld wordt getoond.
<FORM ACTION="[URL]">
<TABLE BORDER="0">
<TR>
<TH>Account:</TH>
<TD><INPUT TYPE="text" NAME="account"></TD>
</TR>
<TR>
<TH>Password:</TH>
<TD><INPUT TYPE="password" NAME="wachtwoord"></TD>
</TR>
<TR>
<TD> </TD>
<TD><INPUT TYPE="submit" NAME="Inloggen"></TD>
</TR>
</TABLE>
</FORM>
Het korte antwoord is dat het formulier maar één <INPUT TYPE=TEXT> en geen TEXTAREA moet hebben, alhoewel het wel andere formulier-elementen zoals aankruisvakjes en keuzeknoppen kan hebben. Voor een gedetailleerder antwoord, zie <URL:http://ppewww.ph.gla.ac.uk/%7Eflavell/www/formquestion.html>.
Dat kun je niet met HTML doen. Maar je kunt na het formulier een script plaatsen , dat de focus op het gewenste veld plaatst, zoals dit:
<FORM ID="mijnform" NAME="mijnform" ACTION=...>
<INPUT TYPE="text" ID="mijninput" NAME="mijninput" ...>
</FORM>
<script type="text/javascript"><!--
document.mijnform.mijninput.focus();
//--></script>
Een soortgelijke aanpak om de focus te plaatsen is mogelijk met behulp van <BODY ONLOAD=...>, maar sommige browsers lijken de ONLOAD-gebeurtenis uit te voeren nog voordat het gehele document (met bijv. het deel dat het formulier bevat) is geladen.
In plaats van de normale submit-knop (<INPUT TYPE=submit ...>), kun je een afbeelding gebruiken voor een aangepaste submit knop. Gebruik <INPUT NAME=Send TYPE=image SRC="http://url.to/image.gif" ALT="Zend" VALUE="Zend">. De meeste browsers sturen daarnaast ook de x en y coördinaten van de locatie waar de gebruiker klikte op de afbeelding naar de server. Deze zijn beschikbaar als "Zend.x=000&Zend.y=000" in de CGI input. Zie voor meer informatie <URL:http://ppewww.ph.gla.ac.uk/%7eflavell/www/trysub.html>.
Voor de 'reset'-knop zou je <BUTTON TYPE=reset ...>, JavaScript, en/of stylesheets kunnen gebruiken, alhoewel geen van deze methodes altijd n overal werkt. Zie voor meer informatie <URL:http://mirror.subotnik.net/jkorpela/forms/imagereset.html>.
Zeker. Dit maakt deel uit van HTML 2.0 Formulier-ondersteuning (sommige vroege browsers ondersteunden het niet, maar het browserbereik is nu uitstekend).
Je zult je 'Submit'-knoppen een 'Name'-attribuut moeten geven, en, optioneel, een 'value'-attribuut. Om erachter te komen komen welke knop wordt gebruikt, zul je onderscheidende 'Name's of 'Value's willen gebruiken, of allebei. Naast dat het wordt verzonden naar de server, geven browsers het 'Value'-attribuut ook weer in het formulier, dus kies iets dat zinvol is voor de gebruiker, zoals in dit voorbeeld:
<INPUT TYPE=SUBMIT NAME=deelnemen VALUE="Ik wil nu deelnemen"> -of-
<INPUT TYPE=SUBMIT NAME=info VALUE="Stuur meer informatie aub">
Merk op dat als je afbeeldings-verzendknoppen gebruikt, dat deze ook van verschillende 'Value'-attributen moeten worden voorzien.
Als je niet zeker weet welke resultaten je krijgt als je het formulier verzend, heeft Tipjar een standaard script dat je kunt gebruiken. Codeer dit, bijvoorbeeld (uitgaande van de methode "post"):
<form method="post" action="http://www.tipjar.com/cgi-bin/test">
en voer dan de handelingen uit om je formulier te verzenden. De Tipjar-server decodeert de formulier-gegevens, en geeft het resultaat voor je weer.
Nee. Een formulier moet precies één 'action' hebben. Maar het server-side programma (bijv. CGI), dat de formulierinzendingen verwerkt, kan meerdere taken uitvoeren (bijv. een database bijwerken, e-mail versturen, een transactie opslaan) naar aanleiding van één enkele formulierinzending.
Ja. Zorg ervoor, dat het server-side programma (bijv. CGI) dat de formulierinzendingen verwerkt, een foutbericht stuurt als het veld niet goed is ingevuld. Het is het mooiste als dit foutbericht een exemplaar van het originele formulier bevat met de oorspronkelijk (incompleet) opgegeven gegevens al van te voren ingevuld.
Daar bovenop kun je JavaScript gebruiken in het ONSUBMIT-attribuut van het formulier om te formulier te controleren voor degenen die JavaScript hebben ingeschakeld. Laat de ONSUBMIT-gebeurtenisafhandeling de gebruiker op de hoogte stellen van het probleem als het formulier niet compleet is, en dan 'false' teruggeven. Merk op dat het server-side programma niet afhankelijk moet zijn van het controlewerk van het client-side script.
Ten eerste: de RFC hiervoor is te vinden op <URL:http://www.ics.uci.edu/pub/ietf/html/rfc1867.txt>.
Bestand-upload wordt verzorgd door de CGI.pm Perl5 library beschikbaar op <URL:http://stein.cshl.org/WWW/software/CGI/cgi_docs.html>. The most recent versions of the cgi-lib.pl library also support file upload.
Deze zaken zijn noodzakelijk voor uploads vanaf een website:
<form method="POST" enctype="multipart/form-data" action="fup.cgi">
Bestand te uploaden: <input type=file name=upfile><br>
Aantekeningen m.b.t. het bestand: <input type=text name=note><br>
<input type=submit value=Druk> om het bestand te uploaden!
</form>
Niet alle browsers ondersteunen bestand-upload op basis van formulieren, dus probeer waar mogelijk alternatieven te geven. Als je bestands-upload nodig hebt in combinatie met formulier-naar-email, kan het Perl pakket MIME::Lite e-mail-bijlagen verwerken.
Dit kan niet met alleen HTML; iets anders moet het formulier verwerken. Verwerking met JavaScript werkt alleen maar met lezers die een JavaScript-geschikte browser hebben. CGI en andere server-side verwerking is betrouwbaar voor menselijke lezers, maar zoekmachines hebben problemen met het volgen van elke navigatie die op formulieren is gebaseerd.
Kijk op <http://mirror.subotnik.net/jkorpela/forms/navmenu.html>, waar wordt uitgelegd hoe uitklapmenu's kunnen worden gemaakt, naast enkele betere navigatie-alternatieven.