Select թեգ
select թեգը ստեղծում է բացվող ցուցակ
HTML ֆորմաներում օգտագործելու համար:
Ցուցակի առանձին կետը պետք է պահվի
option թեգում:
Ատրիբուտներ
| Ատրիբուտ | Նկարագրություն |
|---|---|
multiple |
Այս ատրիբուտի առկայությունը ստեղծում է մուլտիսելեկտ -
բացվող ցուցակ, որտեղ կարելի է ընտրել մի քանի կետ՝ սեղմած պահելով
Ctrl կոճակը կամ դրանք ընդգծելով մկնիկով:
Ոչ պարտադիր ատրիբուտ: |
name |
Բացվող ցուցակի անունը: Անհրաժեշտ է, որպեսզի PHP-ում կարողանանք ստանալ մուտքագրման դաշտի տվյալները: Ֆորմայի ճիշտ աշխատանքի համար մուտքագրման դաշտերի անունները չպետք է համընկնեն միմյանց հետ (մեկ ֆորմայի ներսում): Եթե դրանք համընկնում են, ապա PHP կգան այն մուտքագրման դաշտի տվյալները, որը HTML կոդում ավելի ներքև է գտնվում: |
Օրինակ
Եկեք տեսնենք, թե ինչպես է աշխատում բացվող ցուցակը.
<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Օրինակ
Եկեք բացվող ցուցակի լայնությունը դարձնենք
հավասար ամենամեծ տարրի լայնությանը (եթե
այն հստակ չի նշված CSS-ի width
հատկության միջոցով).
<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Օրինակ . Լռելյայն ընտրություն
Հիմա եկեք փորձենք ընտրել լռելյայն քաղաք:
Դա անենք selected ատրիբուտի օգնությամբ.
<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Օրինակ . Մուլտիսելեկտ
Հիմա եկեք սովորական սելեկտը վերածենք
մուլտիսելեկտի multiple ատրիբուտի օգնությամբ.
<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
Ուշադրություն դարձրեք, որ սելեկտի անունը, որը նշված է name ատրիբուտում,
պետք է լինի քառակուսի փակագծերով վերջում: Սա անհրաժեշտ է, որպեսզի PHP-ում
գան բոլոր ընտրված արժեքները (հակառակ դեպքում կգա միայն մեկը` վերջինը):
Օրինակ . Մեկից ավելի լռելյայն արժեքներ մուլտիսելեկտում
Հիմա, մուլտիսելեկտում լռելյայն, փորձենք ընտրել մեկից ավելի արժեք.
<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
: