Тег select
Тег select креира падајућу листу
за употребу у HTML формама.
Појединачна ставка листе се чува у
тегу option.
Атрибути
| Атрибут | Опис |
|---|---|
multiple |
Присуство овог атрибута креира мултиселект -
падајућу листу у којој се може изабрати више ставки, држећи
тастер Ctrl или означивши их мишем.
Необавезан атрибут. |
name |
Име падајуће листе. Потребно је да би се подаци поља уноса извукли у PHP-у. За исправан рад форме, имена уносних поља не би требало да се поклапају међусобно (у једној форми). Ако се поклапају - у PHP ће стићи подаци оног уносног поља које је ниже у HTML коду. |
Пример
Хајде да погледамо како функционише падајућа листа:
html<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Пример
Хајде ширину падајуће листе да направимо
једнаком ширини највећег елемента (ако
она није експлицитно задата коришћењем CSS својства
width):
html<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Пример . Подразумевани избор
А сада хајде да пробамо да изаберемо град
подразумевано. Урадићемо то помоћу атрибута
selected:
html<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Пример . Мултиселект
Хајде сада да претворимо обичан селект у
мултиселект помоћу атрибута multiple:
html<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Обратите пажњу на то да име селекта, задато у атрибуту name,
треба да буде са квадратним заградама на крају. То је потребно да би у PHP
стигла све изабране вредности (иначе ће стићи само једна - последња).
Пример . Неколико подразумеваних вредности у мултиселекту
А сада, у мултиселекту подразумевано, хајде да пробамо да изаберемо више од једне вредности:
html<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
Результат: