Form attributt for skjemafelter i HTML

De fleste som jobber med nettsider er i en eller annen forbindelse nødt til å håndtere skjemaer (forms) i HTML. Skal du ha et kontaktskjema, bestillingsskjema, handlevogn, pålogging, kommentarfelter eller lignende så kommer du ikke utenom <forms>.

I et HTML-skjema har det alltid vært en regel at alle skjemafelter ligge innenfor form-taggen for at de skal være en del av skjemaet. Legger du et skjemafelt utenfor form-taggen vil de rett og slett ikke fungere.

<form method="post" action="/" id="mittSkjema">
...skjemafelter her...
</form>
<!-- dette feltet er plassert utenfor skjemaet og vil derfor ikke fungere -->
<input type="text" name="navn">

I noen situasjoner kan nettopp dette by på problemer. Det kan være du har et design på siden som gjør det nærmest umulig å samle alle skjemafelter innenfor form-taggen, uten å gå på akkord med designet.

Dette har vært en problem, inntil «nylig».

Det kan oppstå situasjoner hvor det er ønskelig med skjemafelter som skal plasseres et helt annet sted på siden, men samtidig være en del av det samme skjemaet.

La oss si at form-taggen ligger i en kolonne, men du ønsker samtidig å tilby skjemafelter i en annen kolonne på siden, og det er ikke aktuelt å legge form-taggen rundt begge kolonner. Dette kan for eksempel være tilfellet hvis du har flere skjemaer på samme side.

Form-attributt er løsningen

Med form-attributtet har vi mulighet til å håndtere dette på en enkel måte. Form-attributtet henviser til ID på form-taggen, slik som vist her:

  <input type="text" name="navn" form="mittSkjema">

Med form-attributtet på plass kan input-feltet ovenfor plasseres hvor som helst på siden, helt uavhengig av form-taggen, og vil automatisk være en del av skjemaet da det henviser til ID som er brukt på form-taggen.

Relaterte kurs

Del denne artikkelen:

Legg igjen en kommentar

Din e-postadresse vil ikke bli publisert.