FORMULÄR

Formulär är användbart om du vill att folk ska kunna ta kontakt med dig. De består av rutor, knappar och fält. Där kan man knappa in text och välja mellan olika grejor. Dessa skickas sedan via epost till en apostadress du har bestämt. Är du sen en hejare på hacking i största allmänhet så kan du låta en dator analysera majlet och tex automatiskt lägga in snubben på en mailinglista, eller nått annat skoj. För dig som tycker att det är mycket roligare att se hur det funkar genom att titta på färdig kod, så finns det ett exempel länkat längst nere på sidan.

GRUNDKODERNA
I HTML fungerar det så att det finns taggar och sluttaggar. Detta är du säkert bekant med om du kommit så långt med HTML att du börjat intresera dig för forms. Start och sluttaggarna för forms är
<FORM>
</FORM>

Innanför dessa skriver du alla andra taggar, och i den första FORM-taggen ska du skriva in alla de taggar som gäler för hela formuläret.

SKRIV OCH SKICKA
Vi börjar nu med enklast tänkbara formulär: Du vill att en person ska kunna tala om vad han heter. Formuläret kommer då att se ut så här:

Ditt namn:

Värdet enctyp kan även sättas till "plain".

Koden ser ut på detta sättet:
<FORM method=post action="mailto:tomten@nordpolen.com" enctype="text/plain">
Ditt namn:<INPUT type=text name="name" size=25 maxlength=30>
<INPUT type="submit" value="Sänd">
</FORM>

Nu över till koden. Den första raden har följande betydelse:
method=post är till för att tanken med formuläret är att skicka ett email. Det finns ett alternativ till: GET, men det ären annan femma.
action="mailto:tomten@nordpolen.com" är väl rätt trivial; tala om min epost.
enctype="text/plain" är till för att den som får alla mail som skickas härifrån ska kunna läsa det lättare. Det finnsen typ til, och den är lämplig om det är en dator istället för en människa som ska ta hand om formuläret.

Nästa rad har följande taggar:
Ditt namn, lite text innan.
type=text, tala om att det är text som ska stoppas in.
name="name" namnger bara rutan, för senare referns. Om du skriver Pelle i fältet kommer det att stå first_name="Pelle" eller nått sånt i majlet som kommer fram.
size=25 bestämmer textrutans bredd.
maxlength=30. Heter du nått med mer än 30 bokstäver får du problem här.

Knappens kod betyder:
type="submit" är komandot i knappen, dvs vad den gör: sänder innehållet.
value="Sänd" Texten i knappen.

RADERA INNEHÅLL I FÄLT
Nu vill vi kunna radera.
Koden igen, nu med en rad till.

Jämför den nya raden med den för skickaknappen. Skilnaden är type="reset" i stället för type="submit", och att knappen heter anerlunda förståss. Så här blir formuläret.

Ditt namn:

KOMENTARER
Man kan vilja skicka långa textmassor, tex komentarer. Du känner igen detta från guestbooks. (Jag tog bort skickaknappen).

Kommentarer:

Koden är:
<FORM>
Kommentarer:<BR>
<TEXTAREA name="feedback" COLS=35 ROWS=10>
</TEXTAREA>
<INPUT type="reset" value="Radera">
</FORM>

Inga svårigheter:
COLS=35 ROWS=10 besämmer storleken.
TEXTAREA är koden som gör att browsern fattar vad det är för nått. (Dvs en textarea.)

RADIOKNAPPAR
Radio-knappar är till för att man ska kunna välja mellan olika alternativ, där man bara kan ta ett. Pröva att klicka här.

x y z

Och koden:
<FORM>
<INPUT TYPE=RADIO NAME="BOKSTAV" VALUE="x" CHECKED> x
<INPUT TYPE=RADIO NAME="BOKSTAV" VALUE="y"> y
<INPUT TYPE=RADIO NAME="BOKSTAV" VALUE="z"> z
</FORM>

Här räknar jag med att du kan ta reda på själv vad de olika taggarna gör. Observera CHECKED, vad gör den?

KRYSSRUTOR
När du ska välja saker, antingen eller, individuellt, så får du använda checkrutor.

<FORM method=post>
<INPUT TYPE=CHECKBOX NAME="x?" VALUE="x"> x
</FORM>
Skilnaden mot radioknappar är TYPE=CHECKBOX istället för TYPE=RADIO

RULLGARDINSMENYER
Rullgardinsmenyer är väldigt bra att ha. Man kan se dem som ett alternativ till radioknappar. Tex när antalet alternativ att välja mellan är för stort för dessa. Så här ser ser dom ut:

Jag är en Och koden ser ut så här:

<FORM>
<SELECT NAME="Typer">
<OPTION>Tönt
<OPTION>Idiot
<OPTION>Knäppskalle
<OPTION>Något annat
</SELECT>
</FORM>
Kopiera och klistra in.

SÖKMOTOR
Och för alla som tycker det är häftigt kan man lägga in sökmotorer i sin hemsida, med en ruta att knacka in sökord i. Så här ser det ut då.