Laste ned presentasjonen
Presentasjon lastes. Vennligst vent
PublisertRasmus Borgen Endret for 9 år siden
1
Høgskolen i Oslo Webprogrammering Java-scripting 2 Klientvalidering
2
I dag l Hvordan få en bedre klientvalidering via Java- script l Gjennomgang av kode l Oppgaveløsning på lab –Prosjekt!!
3
Klientsideprogrammering med JavaScript l Et JavaScript er et lite program som blir utført ”i en nettside”. l JavaScript kan brukes for å lage interaktive nettsider. l Noen anvendelser: –Inndatavalidering –Utføre beregninger –Menyer –Visuelle effekter l Inndatavalidering –Kontroll på klienten gir umiddelbar tilbakemelding til bruker. –Visse kontroller vil bli gjentatt på tjenersiden
4
Samspillet klient / tjener Hent http:://localhost/index.php C://…/index.php Svar : Kildekode i form av HTML 1) 2) PHP Tolker ”; ?> document.write( ”Hei Java" ); Hei PHP document.write( ”Hei Java" ); 3) Hei PHP Hei Java Java Script Tolker
5
Validering l Kilent-validering i Javascript l Server-validering i PHP
6
Bruk av RegEx i Javascript l Eller enklere (ingen new på klassen) regEx = /^[a-zA-ZøæåØÆÅ. ] {2,20}$/; OK = regEx.test(navn); if ( !OK ) // feil regEx = new RegExp("^[a-zA-ZøæåØÆÅ. ]{2,20}$"); OK = regEx.test(navn); if ( !OK ) // feil
7
RegEx i Javascript forts. function valider_navn () { regEx = /^[a-zA-ZøæåØÆÅ.\- ]*$/; OK = regEx.test(document.skjema.navn.value); if ( !OK ) { return false; } return true; }
8
Kalle valideringsfunksjonen function valider_navn () { regEx = /^[a-zA-ZøæåØÆÅ.\- ]*$/; OK = regEx.test(document.skjema.navn.value); if ( !OK ) { return false; } return true; }
9
En valideringsfunksjon per felt function valider_navn () function valider_adresse () function valider_telefonnr ()
10
Feilmeldinger etter feltet Navn: <input type="text" name="navn" onchange ="valider_navn()" /> * * Indikerer at feltet er obligatorisk
11
Legg ut feilmeldinger i div function valider_navn () { regEx = /^[a-zA-ZøæåØÆÅ.\- ]*$/; OK = regEx.test(document.skjema.navn.value); if ( !OK ) { document.getElementById(”feilNavn”).innerHTML=”Feil”; return false; } document.getElementById(”feilNavn”).innerHTML=””; return true; } *
12
Eksempel
13
Må også validere OnSubmit function valider_navn () function valider_adresse () function valider_telefonnr () function valider_alt() { valider_navn (); valider_adresse (); valider_telefonnr (); // return true eller false }
14
Må også validere på server l Dersom Javascript blir slått av i nettleseren: l Må også validere på server i PHP! $navn = $_REQUEST[”navn”]; If( ! preg_match(”/^[a-zA-ZøæåØÆÅ.\- ]*$/",$navn)) { echo ”Navnet er feil!”; } else { // OK, lagre dataene i database! (endelig!) }
Liknende presentasjoner
© 2024 SlidePlayer.no Inc.
All rights reserved.