گروه گزینه ها (optgroup)
با «تگ optgroup» گزینه های مرتبط را گروه بندی می کنیم. «گروه بندی (Grouping)» یعنی دسته کردن گزینه ها زیر یک عنوان. این کار لیست های طولانی را قابل فهم می کند.
تگ optgroup چیست؟
تگ «optgroup» درون «select» می آید و گزینه ها را دسته بندی می کند. «select (Drop-down)» همان لیست کشویی است. هر گزینه با «option» ساخته می شود.
نکته: وقتی لیست طولانی است، گروه ها انتخاب را سریع تر می کنند.
نمونه: گروه بندی ساده
<label for="cars">Choose a car:<\/label>
<select name="cars" id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo<\/option>
<option value="saab">Saab<\/option>
<\/optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes<\/option>
<option value="audi">Audi<\/option>
<\/optgroup>
<\/select>
نمونه: گروه غیرفعال (disabled)
<select name="cars" id="cars">
<optgroup label="Unavailable" disabled>
<option value="mercedes">Mercedes<\/option>
<option value="audi">Audi<\/option>
<\/optgroup>
<optgroup label="Available">
<option value="volvo">Volvo<\/option>
<option value="saab">Saab<\/option>
<\/optgroup>
<\/select>
ویژگی های مهم تگ optgroup
label: متن عنوان گروه.disabled: غیرفعال کردن کل گروه.
راهنمای سریع قدم به قدم
- یک تگ <select> بساز.
- برای هر دسته، <optgroup> با label بگذار.
- داخل هر گروه، چند <option> اضافه کن.
- در صورت نیاز، گروه را disabled کن.
جمع بندی سریع
- تگ optgroup گزینه ها را دسته بندی می کند.
- label عنوان گروه را نشان می دهد.
- disabled کل گروه را می بندد.
- برای لیست های طولانی عالی است.
- تگ optgroup را همیشه استاندارد نگه دار.