<form action=”register.html”> <input type=”text” name=”navn”> <input type=”number” name=”alder”> <button type=”submit”>Registrer navn og alder</button> </form> fil:///IT1/Kode1/Kap1/register.html
Resultatet av koden er et skjema som skal fylles ut med navn og alder.
Registrer navn og alder
Når brukeren klikker på knappen, sendes skjemaet til en annen nettside. Vi må derfor opprette en egen mappe og lag to HTML-filer. I den ene filen skal du skrive HTML-koden for skjemaet. Den andre HTML-filen kan være tom.
EKSTRASTOFF
URL-parametere Når du skriver inn navn og alder i eksempelet ovenfor og trykker på knappen, vil du se at nettsiden med URL-adressen register.html lastes inn i nett leseren. I adressefeltet på nettleseren ser du at det du skrev i skjemaet, sendes med og blir liggende etter navnet på URL-adressen. Dette kaller vi URL-parametere. Med URL-parametere kan vi sende informasjon mellom nettsider. Vi skriver
Hanne og 18 som henholdsvis navn og alder og klikker på knappen. Det er to parametere som sendes: navn=Hanne og alder=18. Vi skal ikke gjøre noe mer med dataene vi sender med skjemaer i dette kapittelet. Nettsiden vi sender data til, kan ha kode som legger navnet vårt og alderen inn i et kunderegister. Dette får du lære mer om i kapittel 9.
fil:///IT1/Kode1/Kap1/register.html?navn=Hanne&alder=18
Data fra skjemaet sendes til en annen nettside som URL-parametere.
Brukervennlighet og label-elementet Det er viktig at de dataene brukeren skriver inn i et skjema er skrevet inn på riktig måte, og at brukeren har fylt inn informasjon i alle input-elementene. Skjemaet bør gi brukeren informasjon om hva som skal skrives i innskrivingsfeltene. Vi bruker label-elementet <label>…</label> til å sette på en «etikett» eller merkelapp på et input-element.
Label-elementet gir en etikett der vi skriver informasjon til brukeren: <form action=”register.html”> <label>Navn:</label> <input type=”text” name=”navn” placeholder=”Kari Nordmann” required> </form>
< 01 Lage nettsider med HTML >
Kode1_Informasjonsteknologi Kap01.indd 29
29
24.04.2017 12:47:14