Select-taggen
Tagget select opretter en dropdown-menu
til brug i HTML formularer.
En enkelt menuoptslag skal opbevares i
tagget option.
Attributter
| Attribut | Beskrivelse |
|---|---|
multiple |
Tilstedeværelsen af denne attribut opretter en multiselect -
en dropdown-menu, hvor det er muligt at vælge flere punkter ved at holde
tasten Ctrl nede eller markere dem med musen.
Frivillig attribut. |
name |
Dropdown-menuens navn. Nødvendigt for at kunne tilgå feltets data i PHP. For at formularen fungerer korrekt, skal feltnavnene ikke være ens (i samme formular). Hvis de er ens, modtages data i PHP fra det inputfelt, der ligger længere nede i HTML-koden. |
Eksempel
Lad os se, hvordan en dropdown-menu fungerer:
<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Eksempel
Lad os gøre dropdown-menuens bredde
lig med bredden af det største element (hvis
den ikke er angivet eksplicit ved hjælp af CSS-egenskaben
width):
<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Eksempel . Standardvalg
Lad os nu prøve at vælge en by
som standard. Dette gøres ved hjælp af attributten
selected:
<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Eksempel . Multiselect
Lad os nu omdanne en normal select til en
multiselect ved hjælp af attributten multiple:
<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Læg mærke til, at select-navnet, angivet i attributten name,
skal have kantede parenteser i slutningen. Dette er nødvendigt for, at alle de valgte værdier
kommer til PHP (ellers modtages kun én - den sidste).
Eksempel . Flere standardværdier i multiselect
Lad os nu, i multiselect som standard, prøve at vælge mere end én værdi:
<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
:
