Skjemaer

Skjemaer er et sentralt verktøy for å samle inn brukerdata og sende det til en server for behandling. De består av ulike skjemafelt som lar brukeren legge inn informasjon. I dette kurset vil vi imidlertid ikke sende data til en server, da dette krever kunnskap som ligger utenfor kursets omfang.

Alle eksempler i koden har attributtet onsubmit="return false". Dette attributtet hindrer skjemaet i å sende en forespørsel til serveren som standard.

Opprette skjemaer

<form>-taggen brukes for å lage et interaktivt skjema på en nettside. Den inneholder ulike skjemafelt for brukerinput.
Eksempel:

<form>
  <!-- Form elements go here -->
</form>

Skjemafelt

HTML tilbyr ulike inputtyper for å samle inn brukerdata. Hver type har spesifikke attributter og egenskaper. Det er også mulig å angi etiketter for hvert inputfelt. Etiketter brukes for å knytte tekst til skjemafelt, noe som gir en mer tilgjengelig og brukervennlig opplevelse. Vi vil gå nærmere inn på etiketter og inputfelt i de neste kapitlene.
Eksempel:

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
</form>

Innsending av skjema

Innsending av skjema utløses av en send-knapp (<button type="submit">), som kan sende skjemadata til serveren for behandling.
Eksempel:

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
  <button type="submit">Submit</button>
</form>

Her er et grunnleggende skjemaeksempel.

Videoveiledning