Element select
Element select vytvára rozbaľovací zoznam
pre použitie v HTML formulároch.
Samostatná položka zoznamu musí byť uložená v
elemente option.
Atribúty
| Atribút | Popis |
|---|---|
multiple |
Prítomnosť tohto atribútu vytvára multiselect -
rozbaľovací zoznam, v ktorom je možné vybrať viacero položiek podržaním
klávesu Ctrl alebo ich označením myšou.
Nepovinný atribút. |
name |
Názov rozbaľovacieho zoznamu. Potrebný na to, aby bolo možné získať údaje vstupného poľa v PHP. Pre korektnú funkciu formulára by sa názvy vstupných polí nemali navzájom opakovať (v jednom formulári). Ak sa zhodujú - v PHP prídu údaje toho vstupného poľa, ktoré je nižšie v HTML kóde. |
Príklad
Pozrime sa, ako funguje rozbaľovací zoznam:
<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Príklad
Nastavme šírku rozbaľovacieho zoznamu tak,
aby bola rovná šírke najväčšieho prvku (ak
nie je explicitne uvedená pomocou CSS vlastnosti
width):
<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Príklad . Predvoľba
A teraz skúsme nastaviť mesto
ako predvolené. Urobíme to pomocou atribútu
selected:
<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Príklad . Multiselect
Teraz premeňme obyčajný select na
multiselect pomocou atribútu multiple:
<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Všimnite si, že názov selectu, zadaný v atribúte name,
by mal byť s hranatými zátvorkami na konci. Je to potrebné preto, aby v PHP
prišli všetky vybrané hodnoty (inak príde len jedna - posledná).
Príklad . Viacero predvolených hodnôt v multiselecte
A teraz, v multiselecte, skúsme vybrať viac ako jednu hodnotu ako predvolenú:
<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
: