Laste ned presentasjonen
Presentasjon lastes. Vennligst vent
1
HTML – 3. økt HiO IT20 Onsdag
2
Plan Repetisjon/spørsmål fra 4.11 Skjemaer – (forms) Oppgaver
Oppsummering
3
Skjemaer (i) Grunnlag for interaktivitet på nettet
Brukeren kan utveksle data med andre brukere
4
Skjemaer (ii) Tag-struktur: Hovedtag Input-bokser
<FORM>…</FORM> <INPUT TYPE= Text Textarea Checkbox Radio Option Submit Reset
5
Skjemaer (iii) <FORM> Et navn
Method – sending (POST) eller mottak (GET) av data ACTION sende data via e-post eller aktivere hjemmeside <FORM Name=”skjema” METHOD=POST ACTION= onSubmit=window.alert (’Skjemaet sendes pr e-post’)>
6
Skjemaer (iv) Eksempler: <INPUT TYPE=”text” NAME=”tittel”
SIZE=50> <TEXTAREA NAME=”beskrivelse” ROWS=”5”></TEXTAREA> <INPUT NAME=”barn” TYPE=”checkbox”>Barn
7
Skjemaer (v) <INPUT NAME =”nasjon” TYPE=”radio” VALUE=”norsk”>Norsk Radioknapper: Kun en verdi gjelder Alle knapper må ha samme navn
8
Skjemaer (vi) ”Kombobox” – flere valgmuligheter
<SELECT NAME=”sjanger” SIZE=”0”> <OPTION>Krim <OPTION>Fantasy <OPTION>Science Fiction <OPTION>Grøsser </SELECT>
9
Skjemaer (vii) INPUT NAME=”submit” TYPE=”submit” VALUE=”Send skjema”> INPUT NAME=”reset” TYPE=”reset” VALUE=”Nullstill skjema”>
10
Skjemaer (viii) <!Dokumenteksempler for skjemaer> <html>
<head> <title> Eksempel på skjema</title> </head> <body> <h1>Her kommer et eksempel på registreringsskjema</h1> <h2>HTML-registrering</h2> <p> <FORM METHOD=POST enctype="text/plain" onSubmit="window.alert ('Skjemaet sendes pr e-post, selv om det tilsynelatende ikke skjer noe sm helst')"> Tittel: <br> <INPUT TYPE="text" NAME="tittel" SIZE=50><p> Beskrivelse:<BR> <TEXTAREA NAME="beskrivelse" ROWS="5" SIZE="50"></TEXTAREA><p> Målgruppe: <INPUT NAME="barn" TYPE="checkbox"> Barn <INPUT NAME="unge" TYPE="checkbox">Unge <INPUT NAME="voksne" TYPE="checkbox"> Voksne<p> Nasjonalitet: <INPUT NAME="nasjonalitet" TYPE="radio" VALUE="norsk"> Norsk <INPUT NAME="nasjonalitet" TYPE="radio" VALUE="nordisk"> Nordisk <INPUT NAME="nasjonalitet" TYPE="radio" VALUE="amerikansk"> Amerikansk <INPUT NAME="nasjonalitet" TYPE="radio" VALUE="annet"> Annet<p> Sjanger: <SELECT NAME="sjanger" SIZE="0"> <OPTION>Krim <OPTION>Fantasy <OPTION>Science Fiction <OPTION>Grøsser </SELECT><p> <INPUT NAME="submit" TYPE="submit" VALUE="Send skjema"> <INPUT NAME="reset" TYPE="reset" VALUE="Nullstill skjema"> </FORM> </body> </html>
11
Oppgave Lag minst to skjemaer basert på mønstret og detaljene over
Test skjemaene mot egen postkasse
Liknende presentasjoner
