|
|
Les 9: Formulieren
Je hebt nu al een site kunnen bouwen, maar je wilt natuurlijk wel graag weten wat bezoekers van je pagina vinden. In deze les leer je hoe je een formulier kunt maken die bezoekers op kunnen sturen.
We beginnen met de hoofdtag. Je opent een formulier met <form> en sluit hem met </form>. Daartussen komen de gegevens van het formulier te staan.
Nu gaan we eerst de <form> tag editten. Geef tussen <form en > een spatie en tik in: action="mailto:[email protected]" method="post". Dit geeft aan dat het formulier verzonden moet worden naar het e-mail adres [email protected].
Ik zal een kort overzichtje geven met dingen die je in het formulier kunt zetten. Vergeet niet alles een name te geven, anders weet de computer niet wat het moet versturen.
Als je een stukje tekst wilt vragen ( bijvoorbeeld de naam van iemand) neem dan dit over: <input type="Text" name="naam" size="20">. Het soort is een tekstbalk met de grootte 20 en de naam naam.
Als je een aantal keuzes wilt geven ( bijvoorbeeld hoe vaak iemand je pagina per week bezoekt) neem dan dit over: <input type="Radio" name="2 keer">2 keer. Je hebt een radio button gemaakt met de naam 2 keer. Wat je erachter zet is de tekst die je achter die radio button zet.
Als je meerdere keuzes wilt geven ( bijvoorbeeld wat voor soort huisdier iemand heeft) neem dan dit over: <input type="Checkbox" name="hond">Hond. Je hebt nu een checkbox gemaakt met de naam hond. Wat je erachter zet komt achter de checkbox te staan.
Als je een grotere tekst wilt vragen ( bijvoorbeeld als je commentaar wilt vragen) neem dan dit over: <textarea name="comment" cols="40" rows="10">Commentaar</textarea>. Je hebt nu een textarea gemaakt met de naam comment en de grootte 40 bij 20. Wat je tussen <textarea name="comment" cols="40" rows="10"> en </textarea> zet komt erin te staan.
Nu moet je het kunnen verzenden. Daarvoor gebruik je een submit button. Neem dit over: <input type="Submit" name="submit" value="Verzenden">. Je hebt nu een sumit button gemaakt met de value Verzenden. Dat betekent dat op de knop Verzenden komt te staan.
Tenslotte nog een wis button. Hiermee wordt alles gewist. Neem dit over: <input type="Reset" value="Wissen">. Je hebt een reset button gemaakt met de value Wissen. Op de knop komt dus wissen te staan.
Het overzicht dat je gemaakt hebt ziet er ongeveer zo uit:
<form action="mailto:[email protected]" method="post">
Naam:<br>
<input type="Text" name="naam" size="20"><br>
Hoe vaak bezoek je deze site per week?<br>
<input type="Radio" name="1 keer">1 keer<br>
<input type="Radio" name="2 keer">2 keer<br>
<input type="Radio" name="3 keer">3 keer<br>
Huisdieren?<br>
<input type="Checkbox" name="hond">Hond<br>
<input type="Checkbox" name="poes">Poes<br>
<input type="Checkbox" name="konijn">Konijn<br>
<input type="Submit" name="submit" value="Verzenden"><br>
<input type="Reset" value="Wissen"><br>
</form>
Dit resulteert in dit:
Je bent hier klaar. Je kun nu verder naar Les 10: Leuke extra's.
|
