2D2051 Databasteknik och datorkommunikation

Laboration 4: Verifiering av formulär med Javascript

Förberedelser

Det hjälper om man studerat föreläsningsanteckningarna om Javascript. Laboration 3 behöver vara klar.

Redovisning

Laborationen utföres i grupper om 2 personer (eller ensamma om ni vill och det finns plats). Redovisning sker muntligt vid labbtillfälle eller senare efter överenskommelse. Observera att laborationerna 3 och 4 redovisas tillsammans.

Kökslista med kontroll av data

I denna laboration skall du modifiera laboration 3. Du skall kontrollera data som skickas iväg då man trycker på en knapp. Observera att detta kontrolleras i webbläsaren med javascriptkod, inte på servern (med t.ex. php-kod).
Då man trycker på submit-knappen "Ny person" skall du kontrollera att namn-variabeln inte är tom och emailadressen innehåller '@'.
Då man trycker på submit-knappen "Ny ansvarig" skall du kontrollera att 0 < veckonr < 54.
Om ett fel hittas, skall inga data skickas till servern, men ett meddelande visas för användaren om vad som är fel.

Kommentarer

Förutom filerna som behövs för laboration 3 behövs också en fil koklista.js som innehåller javascript-funktioner som används i en modifierad koklista.php.
Du behöver två funktioner (+ eventuellt hjälprutiner), en för vardera formulär.
För att funktionen FOO skall exekveras då man trycker på en submit-knapp i ett formulär, så skall <form> ha ett attribut onsubmit="return FOO();". FOO kontrollerar data som hör till en knapp. Om data är rätt, skall FOO returnera true vilket gör att submit lyckas och data sänds till servern. Om data är fel, skall FOO sätta ihop en sträng med klagomål på felaktiga data och visa denna för användaren i ett alert-fönster. Därefter skall FOO returnera false vilket gör att submit misslyckas och data sänds ej till servern.
I föreläsningsanteckningarna finns en webbsida som räknar ut kostnaden för en dator. Där finns en funktion som verifierar indata då man trycker på submit-knappen. Vad du skall göra är analogt med detta exempel.