Grunder om formulär

Formulär används för att besökare på något sätt ska kunna kontakta avsändaren eller interagera med webbplatsen. Via ett formulär kan man t.ex. låta besökaren fylla i personuppgifter för en registrering, skriva i forum och gästböcker, samt beställa varor.

Med XHTML kan man enbart skapa formulärets struktur, samt beskriva vart den ifyllda informationen ska skickas för vidare behandling.

Ett formulär kan fungera först när sidan är publicerad och det finns ett särskilt skript eller program på webbservern som kan ta emot det som skickas.

OBS! Läs mer här om vad som krävs för att få ett formulär att fungera.

Skapa ett formulärområde

En webbsida kan innehålla ett eller flera formulär. Varje formulär ska först och främst bestå av elementet <form> som utgör hela formulärets område.

Formulärelement ska alltid namnges med attributet id för att kunna identifieras av ett program. Man kan även lägga till attributet name och ge det samma värde som id. Det gör att dokumentet också fungerar med äldre webbläsare.

<form id="kontakt" name="kontakt">    

</form>

Formulärelementet ska i sin tur innehålla de taggar som används för att skapa inmatningskontrollerna, d.v.s. knappar, textrutor, listor m.m.

Inom formulärområdet kan de flesta block- och fraselement användas för att ställa upp formulärets delar på ett snyggt sätt, t.ex. styckeelement. Man får dock inte skapa nya formulärområden i ett tidigare formulärområde.

Skicka formulär till skript

Elementet <form> ska innehålla de attribut som gör att uppgifterna kan skickas till rätt skript. Attributet action beskriver adressen till skriptet, medan attributet method talar om hur innehållet ska skickas. Värden till method kan vara "get" eller "post".

Metoden "get" används främst till kortare formulär och där inga bestående förändringar ska ske när uppgifterna skickas. Metoden "post" används förmodligen mest och lämpar sig t.ex. när information ska sparas i databaser och andra filer.

<form id="kontakt" action="skript/mail.asp" method="post">
 ...  

</form>

Formulärets innehåll kan också skickas direkt till en e-postadress om man vid attributet action skriver mailto: följt av en e-postadress. Förutsättningen är densamma som när man gör e-postlänkar med mailto:, d.v.s. att användaren måste kunna skicka från det e-postprogram som webbläsaren startar.

Attributet enctype används för att beskriva hur informationen ska formuleras i e-postmeddelandet. Med värdet "text/plain" bör mottagaren kunna läsa innehållet som ren text.

<form action="mailto:nisse@swipnet.se" enctype="text/plain">
 ...
</form>

Formulärets delar

Element som kan användas i <form> är bland andra <input />, <select> och <textarea>. De utgör alla olika typer av inmatningsobjekt. I princip alla formulärdelar kan skapas med <input />, utom listor och meddelanderutor. Med olika värden till attributet type, beskriver man vilken typ av formulärdel <input /> skapar.

Sortera och märka uppgifterna

För att ett skript ska kunna sortera och behandla uppgifterna från ett formulär, är det viktigt att ge de olika delarna namn och värden. Namnet (attributet name) beskriver vilken del eller fråga i formuläret som uppgiften kommer från, medan värdet (attributet value) beskriver själva uppgiften. Värden till båda dessa attribut ska formuleras utan mellanslag och [å] [ä] [ö].

Det är viktigt att attributen name och value får logiska värden. Då blir informationen som skickas begriplig för mottagaren och korrekt införd i en eventuell databas. Om användaren markerar en kryssruta med namnet "skostorlek" och värdet "38", skickas informationen skostorlek=38 från det elementet.

Attributet value används främst i de formulärobjekt där användaren kryssar för eller markerar färdiga alternativ. I textrutor och textfält där användaren själv skriver in uppgifter, används inte attributet value så ofta. Här är det den inskrivna texten som utgör värdet.