Тег 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>
Результат:
Мысал
Төменгі тізімнің енін ең үлкен элементтің еніне тең етейік (егер
ол width CSS қасиеті арқылы
анық көрсетілмесе):
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>
Результат: