HTML’de listeden seçim yaptırmak için en sık kullandığımız nesnelerden biride select elemanıdır ve bu html elemanı içerisindeki listeyi gruplamak isterseniz optgroup etiketini kullanmanız gerekecektir. Tek yapmanız gereken option ile oluşturduğunuz listenizi optgroup etiketleri arasına almak.
HTML optgroup ile select-option elemanlarını gruplama
HTML’de listeden seçim yaptırmak için en sık kullandığımız nesnelerden biride select elemanıdır ve bu html elemanı içerisindeki listeyi gruplamak isterseniz optgroup etiketini kullanmanız gerekecektir. Tek yapmanız gereken option ile oluşturduğunuz listenizi optgroup etiketleri arasına almak. Örnek için alttaki koda bakabilirsiniz.
HTML Kod
1 2 3 4 5 6 7 8 9 10 | <select> <optgroup disabled label="İsviçre Arabaları"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> </optgroup> <optgroup label="Alman Arabaları"> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </optgroup> </select> |
Üstteki kodda optgroup etiketlerinde disabled ve label attribute’lerini görüyorsunuz label grup adını belirtirken disabled ise grup içerisindeki tüm elemanları etkisiz kılıyor yani sadece o grup elemanların seçilme özelliğini kaldırıyor.
Sonuç
Tarayıcı Uyumluluğu
1 Response
[…] HTML Optgroup İle Select Option Elemanlarını Gruplama […]