Formvalidatie Opdracht Les 4

Leerdoelen

• Met deze opdracht toon je je kennis en ervaring van JavaScript.
• Je kunt met JavaScript HTML elementen uitlezen
• Je kunt met JavaScript HTML schrijven
• Je kunt met JavaScript CSS aanpassen

Form Validation Opdracht

Een opdracht gever van een site wil dat zijn klanten zich aanmelden via een formulier op de site. Als klanten zich aanmelden moeten ze verplicht een aantal velden van het formulier hebben ingevuld: Dit zijn: Username, password(2x) Achternaam en Email. De rest zou leukzijn maar is niet noodzakelijk. Wel moet duidelijk zijn dat deze verplicht zijn. Er zijn een aantal stadia voor de weergave van he controle en het formulier:

1: Oningevuld maar met aangegeven verplichte velden nog niet gesubmit

2: Sommige verkeerd ingevoerde velden

3: Alle verplichte velden NIET ingevuld

Als een klant zijn formulier heeft in gevuld willen we dat voor dat het verstuurd word naar de server gecontroleerd wordt op eventuele fouten. (niet ingevulde velden). Met een javscript willen deze gecontroleren. Er is naast de verplichte velden ook nog een andere eis. Het opgegeven wachtwoord moet tweemaal worden ingevoerd. Als deze twee niet gelijk zijn aanelkaar moet de controle een waarschuwing geven zoals hier onder te zien:

4: Nietgelijke passwords

Stappen Deel Opdrachten

1. Maak een formulier in HTML
2. Maak de stylesheet die de bovenstaande stadia mogelijk
3. Maak een Activiteiten Diagram voor de totale form validate (als totaal) en stel je zelf de vraag waar zit het event.
4. Maak een Activiteiten Diagram voor de test van de afzonderlijke velden.
5. Maak het script wat de form validatie uitvoert.

Beoordeling

Deze opdracht is de eerste van twee grote opdrachten die meetellen voor het modulecijfer.