Select-taggen
Taggen select oppretter en nedtrekksliste
for bruk i HTML skjemaer.
Et enkelt listepunkt skal lagres i
taggen option.
Attributter
| Attributt | Beskrivelse |
|---|---|
multiple |
Tilstedeværelsen av dette attributtet oppretter en multiselect -
en nedtrekksliste der flere punkter kan velges ved å holde nede
tasten Ctrl eller ved å markere dem med musepekeren.
Frivillig attributt. |
name |
Navnet på nedtrekkslisten. Nødvendig for å hente ut inndatafeltene i PHP. For at skjemaet skal fungere korrekt, bør ikke feltnavnene i inndataene være like med hverandre (i ett skjema). Hvis de er like, vil dataene komme i PHP fra det inndatafeltet som er lengre nede i HTML-koden. |
Eksempel
La oss se hvordan en nedtrekksliste fungerer:
<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Eksempel
La oss gjøre bredden på nedtrekkslisten
lik bredden på det største elementet (hvis
den ikke er eksplisitt angitt ved hjelp av CSS-egenskapen
width):
<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Eksempel . Standardvalg
La oss nå prøve å velge en by
som standard. Vi gjør dette ved hjelp av attributtet
selected:
<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Eksempel . Multiselect
La oss nå forvandle en vanlig select til en
multiselect ved hjelp av attributtet multiple:
<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Legg merke til at navnet på select, satt i attributtet name,
skal være med hakeparenteser på slutten. Dette er nødvendig for at alle valgte verdier skal komme i PHP
(ellers vil bare én komme - den siste).
Eksempel . Flere standardverdier i multiselect
La oss nå, i multiselect som standard, prøve å velge mer enn én verdi:
<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
:
