دابەزینەکان

گۆڕینی سەرپۆشی ناوەڕۆک بۆ پیشاندانی لیستەکانی بەستەرەکان و زۆر شتی تر بە پێوەکراوەکەی Bootstrap.

تێڕوانینێکی گشتی

دابەزینەکان دەتوانرێت بگۆڕدرێن، سەرپۆشی ناوەڕۆکن بۆ پیشاندانی لیستەکانی بەستەرەکان و زۆر شتی تر. ئەوان بە پێوەکراوەکەی جاڤاسکڕێپتی Bootstrap کە لەگەڵیدا هاتووە کارلێککارانە دەکرێن. ئەوان بە کلیککردن دەگۆڕدرێن نەک بە هۆڤەرکردن؛ ئەمە بڕیارێکی دیزاینی بە مەبەستە.

درۆپداونەکان لەسەر کتێبخانەی لایەنی سێیەم دروستکراون، Popper.js , کە شوێنی داینامیکی و دیاریکردنی دەرچەی بینین دابین دەکات. دڵنیابە پێش جاڤاسکڕێپتی Bootstrap popper.min.js دابنێ یان bootstrap.bundle.min.js/ بەکاربهێنە bootstrap.bundle.jsکە Popper.js لەخۆدەگرێت. Popper.js بەکارناهێنرێت بۆ جێگیرکردنی دابەزینەکان لە navbars هەرچەندە وەک جێگیرکردنی داینامیکی پێویست نییە.

ئەگەر جاڤاسکڕێپتەکەمان لە سەرچاوەوە دروست دەکەیت، پێویستی بەutil.js .

دەستڕاگەیشتن

ستانداردی WAI ARIA role="menu" ویجتێکی ڕاستەقینە پێناسە دەکات ، بەڵام ئەمە تایبەتە بە مینیوەکانی هاوشێوەی بەرنامە کە کردارەکان یان ئەرکەکان دەستپێدەکات. مینیوەکانی ARIA تەنها دەتوانن بابەتی مینیو، بابەتی مینیوی سندوقی هەڵبژاردن، بابەتی مینیوی دوگمەی ڕادیۆیی، گروپەکانی دوگمەی ڕادیۆیی و مینیوی لاوەکی لەخۆ بگرن.

لە بەرامبەردا، درۆپداونەکانی بووتستراپ بە شێوەیەک داڕێژراون کە گشتی بن و بۆ چەندین بارودۆخ و پێکهاتەی مارکاپ بەکاربهێنرێن. بۆ نموونە دەتوانرێت درۆپداونەکان دروست بکرێت کە زانیارییەکانی ناوەوە و کۆنترۆڵی فۆڕمی زیادە لەخۆ بگرن، وەک بواری گەڕان یان فۆڕمی چوونەژوورەوە. هەر لەبەر ئەم هۆکارە، Bootstrap چاوەڕوانی هیچ کام لە تایبەتمەندییە roleو aria-پێویستەکان بۆ مینیوەکانی ARIA ڕاستەقینە ناکات (نە بە شێوەیەکی ئۆتۆماتیکی زیاد دەکات). نووسەران دەبێت خۆیان ئەم سیفەتە تایبەتترانە لەخۆ بگرن.

بەڵام Bootstrap پشتگیرییەکی ناوەکی بۆ زۆربەی کارلێکەکانی مینیوی کیبۆرد ستاندارد زیاد دەکات، وەک توانای جووڵەکردن بەناو تاکە .dropdown-itemتوخمەکاندا بە بەکارهێنانی کلیلەکانی ئاماژەدەر و داخستنی مینیوەکە بە ESCکلیلەکە.

نموونە

گۆڕینی دابەزینەکە (دوگمە یان بەستەرەکەت) و مینیوی دابەزینەکە لەناو .dropdown, یان توخمێکی تر کە ڕایدەگەیەنێت، بپێچە position: relative;. دەتوانرێت دابەزاندنەکان لە <a>یان <button>توخمەکانەوە دەستپێبکرێت بۆ ئەوەی باشتر لەگەڵ پێداویستییە ئەگەرییەکانتدا بگونجێت.

دابەزینی تاکە دوگمە

هەر تاکە گۆرانییەک .btnدەتوانرێت بکرێتە وەرچەرخانێکی دابەزین بە هەندێک گۆڕانکاری مارکاپ. <button>لێرەدا چۆن دەتوانیت بە هەریەکێک لە توخمەکان بیانخەیتە کار :

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>

وە لەگەڵ <a>توخمەکان:

<div class="dropdown show">
  <a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown link
  </a>

  <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>

باشترین بەش ئەوەیە کە دەتوانیت ئەمە بکەیت بە هەر جۆرێکی دوگمە، هەروەها:

<!-- Example single danger button -->
<div class="btn-group">
  <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Action
  </button>
  <div class="dropdown-menu">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
    <div class="dropdown-divider"></div>
    <a class="dropdown-item" href="#">Separated link</a>
  </div>
</div>

دابەزینی دوگمەی دابەشکردن

بە هەمان شێوە، درووستکردنی دوگمەی دابەشکراو دروست بکە بە هەمان نیشانە وەک دابەزینی تاکە دوگمە، بەڵام لەگەڵ زیادکردنی .dropdown-toggle-splitبۆ دوورییەکی دروست لە دەوری کارێتی دابەزین.

ئێمە ئەم پۆلە زیادەیە بەکاردەهێنین بۆ کەمکردنەوەی ئاسۆیی paddingلە هەردوو لای کارێتەکە بە ڕێژەی 25% و لابردنی margin-leftکە زیادکراوە بۆ دابەزینی دوگمەی ئاسایی. ئەو گۆڕانکارییە زیادانە کارێتەکە لە دوگمەی دابەشکردنەکەدا لە ناوەڕاستدا دەهێڵنەوە و ناوچەیەکی لێدان بە قەبارەیەکی گونجاوتر لە تەنیشت دوگمەی سەرەکیدا دابین دەکەن.

<!-- Example split danger button -->
<div class="btn-group">
  <button type="button" class="btn btn-danger">Action</button>
  <button type="button" class="btn btn-danger dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
    <div class="dropdown-divider"></div>
    <a class="dropdown-item" href="#">Separated link</a>
  </div>
</div>

قەبارەدانان

درۆپداونەکانی دوگمە لەگەڵ دوگمەکانی هەموو قەبارەکان کاردەکەن، لەوانەش دوگمەکانی پێشوەختە و سپلیت.

<!-- Large button groups (default and split) -->
<div class="btn-group">
  <button class="btn btn-secondary btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Large button
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>
<div class="btn-group">
  <button class="btn btn-secondary btn-lg" type="button">
    Large split button
  </button>
  <button type="button" class="btn btn-lg btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>

<!-- Small button groups (default and split) -->
<div class="btn-group">
  <button class="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Small button
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>
<div class="btn-group">
  <button class="btn btn-secondary btn-sm" type="button">
    Small split button
  </button>
  <button type="button" class="btn btn-sm btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    ...
  </div>
</div>

گۆڕانی وازهێنان

مینیوەکانی سەرەوەی توخمەکان بە زیادکردنی .dropupبۆ توخمە باوکەکە دەستپێبکە.

<!-- Default dropup button -->
<div class="btn-group dropup">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropup
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

<!-- Split dropup button -->
<div class="btn-group dropup">
  <button type="button" class="btn btn-secondary">
    Split dropup
  </button>
  <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

گۆڕانی درۆپڕایت

مینیوەکانی دابەزین لە لای ڕاستی توخمەکان بە زیادکردن .droprightبۆ توخمە باوکەکە دەستپێبکە.

<!-- Default dropright button -->
<div class="btn-group dropright">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropright
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

<!-- Split dropright button -->
<div class="btn-group dropright">
  <button type="button" class="btn btn-secondary">
    Split dropright
  </button>
  <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropright</span>
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

گۆڕانی درۆپلێفت

مینیوەکانی دابەزین لە لای چەپی توخمەکان بە زیادکردن .dropleftبۆ توخمە باوکەکە دەستپێبکە.

<!-- Default dropleft button -->
<div class="btn-group dropleft">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropleft
  </button>
  <div class="dropdown-menu">
    <!-- Dropdown menu links -->
  </div>
</div>

<!-- Split dropleft button -->
<div class="btn-group">
  <div class="btn-group dropleft" role="group">
    <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      <span class="sr-only">Toggle Dropleft</span>
    </button>
    <div class="dropdown-menu">
      <!-- Dropdown menu links -->
    </div>
  </div>
  <button type="button" class="btn btn-secondary">
    Split dropleft
  </button>
</div>

لە ڕووی مێژووییەوە ناوەڕۆکی مینیوی دابەزین دەبوو بەستەر بن، بەڵام چیتر ئەوە لە v4دا نییە. ئێستا دەتوانیت بە ئیختیاری <button>توخمەکان لە درۆپداونەکانتدا بەکاربهێنیت لەبری تەنها <a>s.

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
    <button class="dropdown-item" type="button">Action</button>
    <button class="dropdown-item" type="button">Another action</button>
    <button class="dropdown-item" type="button">Something else here</button>
  </div>
</div>

بە شێوازی پێشوەختە، مینیویەکی دابەزین بە شێوەیەکی ئۆتۆماتیکی لە سەرەوە و بە درێژایی لای چەپی دایک و باوکەکەی 100% دادەنرێت. زیادکردن .dropdown-menu-rightبۆ a .dropdown-menuبۆ ڕاست ڕێکخستنی مینیوی دابەزین.

سەرەکان بەرز دەکەنەوە! درۆپداونەکان بەهۆی Popper.js ەوە جێگیر دەکرێن (جگە لەو کاتانەی کە لە ناو بارێکدا هەن).

<div class="btn-group">
  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Right-aligned menu
  </button>
  <div class="dropdown-menu dropdown-menu-right">
    <button class="dropdown-item" type="button">Action</button>
    <button class="dropdown-item" type="button">Another action</button>
    <button class="dropdown-item" type="button">Something else here</button>
  </div>
</div>

سەردێڕێک زیاد بکە بۆ ناونانی بەشەکانی کردارەکان لە هەر مینیویەکی دابەزین.

<div class="dropdown-menu">
  <h6 class="dropdown-header">Dropdown header</h6>
  <a class="dropdown-item" href="#">Action</a>
  <a class="dropdown-item" href="#">Another action</a>
</div>

گروپەکانی بابەتە پەیوەندیدارەکانی مینیو بە دابەشکەرێک جیا بکەرەوە.

<div class="dropdown-menu">
  <a class="dropdown-item" href="#">Action</a>
  <a class="dropdown-item" href="#">Another action</a>
  <a class="dropdown-item" href="#">Something else here</a>
  <div class="dropdown-divider"></div>
  <a class="dropdown-item" href="#">Separated link</a>
</div>

فۆڕمێک لەناو مینیویەکی دابەزین دابنێ، یان بیکە بە مینیوی دابەزین، و سوودمەندییەکانی پەراوێز یان پادکردن بەکاربهێنە بۆ ئەوەی ئەو شوێنە نەرێنییەی پێ بدەیت کە پێویستتە.

<div class="dropdown-menu">
  <form class="px-4 py-3">
    <div class="form-group">
      <label for="exampleDropdownFormEmail1">Email address</label>
      <input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="[email protected]">
    </div>
    <div class="form-group">
      <label for="exampleDropdownFormPassword1">Password</label>
      <input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Password">
    </div>
    <div class="form-check">
      <input type="checkbox" class="form-check-input" id="dropdownCheck">
      <label class="form-check-label" for="dropdownCheck">
        Remember me
      </label>
    </div>
    <button type="submit" class="btn btn-primary">Sign in</button>
  </form>
  <div class="dropdown-divider"></div>
  <a class="dropdown-item" href="#">New around here? Sign up</a>
  <a class="dropdown-item" href="#">Forgot password?</a>
</div>

<form class="dropdown-menu p-4">
  <div class="form-group">
    <label for="exampleDropdownFormEmail2">Email address</label>
    <input type="email" class="form-control" id="exampleDropdownFormEmail2" placeholder="[email protected]">
  </div>
  <div class="form-group">
    <label for="exampleDropdownFormPassword2">Password</label>
    <input type="password" class="form-control" id="exampleDropdownFormPassword2" placeholder="Password">
  </div>
  <div class="form-check">
    <input type="checkbox" class="form-check-input" id="dropdownCheck2">
    <label class="form-check-label" for="dropdownCheck2">
      Remember me
    </label>
  </div>
  <button type="submit" class="btn btn-primary">Sign in</button>
</form>

زیاد بکە .activeبۆ شتەکان لە درۆپ داونەکەدا بۆ ئەوەی وەک چالاک ستایلیان بکەیت .

<div class="dropdown-menu">
  <a class="dropdown-item" href="#">Regular link</a>
  <a class="dropdown-item active" href="#">Active link</a>
  <a class="dropdown-item" href="#">Another link</a>
</div>

زیاد بکە .disabledبۆ شتەکان لە درۆپ داونەکەدا بۆ ئەوەی وەک لەکارخراو ستایلیان بکەیت .

<div class="dropdown-menu">
  <a class="dropdown-item" href="#">Regular link</a>
  <a class="dropdown-item disabled" href="#">Disabled link</a>
  <a class="dropdown-item" href="#">Another link</a>
</div>

بەکارهێنان

لە ڕێگەی تایبەتمەندیەکانی داتا یان جاڤاسکڕێپتەوە، پێوەکراوەکە ناوەڕۆکی شاراوە (مینیوەکانی دابەزین) دەگۆڕێت بە گۆڕینی .showپۆلەکە لەسەر بابەتی لیستی باوک. تایبەتمەندییەکە data-toggle="dropdown"پشتی پێدەبەسترێت بۆ داخستنی مینیوەکانی دابەزین لە ئاستی بەرنامەیەکدا، بۆیە بیرۆکەیەکی باشە هەمیشە بەکاری بهێنیت.

لەسەر ئامێرە چالاککراوەکانی دەست لێدان، کردنەوەی دابەزینێک مامەڵەکاری بەتاڵ ( $.noop) زیاد دەکات mouseoverبۆ منداڵە دەستبەجێیەکانی <body>توخمەکە. ئەم هاکە ناشرینە پێویستە بۆ کارکردن لە دەوری quirk لە iOS' event delegation , کە ئەگەرنا ڕێگری دەکات لە لێدانێک لە هەر شوێنێک لە دەرەوەی دابەزینەکە لە دەستپێکردنی کۆدەکە کە دابەزینەکە دادەخات. کاتێک کە درۆپداونەکە دادەخرێت، ئەم mouseoverمامەڵەکارە بەتاڵانەی زیادە لا دەبرێن.

لە ڕێگەی تایبەتمەندییەکانی داتا

زیادکردن data-toggle="dropdown"بۆ بەستەرێک یان دوگمەیەک بۆ گۆڕینی دابەزینێک.

<div class="dropdown">
  <button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown trigger
  </button>
  <div class="dropdown-menu" aria-labelledby="dLabel">
    ...
  </div>
</div>

لە ڕێگەی جاڤاسکڕێپتەوە

لە ڕێگەی جاڤاسکڕێپتەوە پەیوەندی بە درۆپداونەکانەوە بکە:

$('.dropdown-toggle').dropdown()

`data-toggle="dropdown"`هێشتا پێویستە

بەبێ گوێدانە ئەوەی کە ئایا لە ڕێگەی جاڤاسکڕێپتەوە بانگی دابەزینەکەت دەکەیت یان لەبری ئەوە data-api بەکاردەهێنیت، data-toggle="dropdown"هەمیشە پێویستە لەسەر توخمە دەستپێکەری دابەزینەکە ئامادە بیت.

بژاردەکان

دەتوانرێت هەڵبژاردنەکان لە ڕێگەی تایبەتمەندییەکانی داتا یان جاڤاسکڕێپتەوە تێپەڕێنرێت. بۆ تایبەتمەندیەکانی داتا، ناوی هەڵبژاردنەکە زیاد بکە بۆ data-, وەک لە data-offset="".

ناو	جۆر	بنەڕەتی	وەسف
ئۆفسێت	ژمارە \| ڕستە \| کردار	0. 0	ئۆفسێتی دابەزینەکە بە بەراورد بە ئامانجەکەی. بۆ زانیاری زیاتر سەردانی دۆکیومێنتەکانی ئۆفسێتی Popper.js بکە .
وەرگەڕاندن	boolean	ڕاست	ڕێگە بدە Dropdown بگۆڕێت لە ئەگەری سەریەککەوتن لەسەر توخمە ئاماژەکە. بۆ زانیاری زیاتر سەردانی Flip docs ی Popper.js بکە .
سنوور	ڕستە \| پێکهاتە	'scrollParent'	سنووری سنووردارکردنی ڕژانی مینیوی دابەزین. بەهاکانی `'viewport'`, `'window'`, `'scrollParent'`, یان ئاماژەیەکی HTMLElement قبوڵ دەکات (تەنها جاڤاسکڕێپت). بۆ زانیاری زیاتر سەردانی دۆکیومێنتەکانی preventOverflow ی Popper.js بکە .

تێبینی کاتێک boundaryلەسەر هەر بەهایەک دانراوە جگە لە 'scrollParent', ستایلەکە position: staticبۆ .dropdownکۆنتێنەرەکە جێبەجێ دەکرێت.

شێوازەکان

ڕێگا	وەسف
`$().dropdown('toggle')`	مینیوی دابەزینی ناوبارێکی دیاریکراو یان گەشتێکی تابکراو دەگۆڕێت.
`$().dropdown('update')`	شوێنی دابەزینی توخمێک نوێ دەکاتەوە.
`$().dropdown('dispose')`	درۆپداونی توخمێک لەناو دەبات.

ڕووداوەکان

هەموو ڕووداوەکانی دابەزین لە .dropdown-menuتوخمە باوکەکەی 's تەقە دەکرێن و relatedTargetتایبەتمەندییەکیان هەیە، کە بەهاکەی توخمە ئەنکرەکەی دەگۆڕێت.

پێشهات	وەسف
`show.bs.dropdown`	ئەم ڕووداوە دەستبەجێ ئاگر دەبێتەوە کاتێک شێوازی show instance بانگ دەکرێت.
`shown.bs.dropdown`	ئەم ڕووداوە کاتێک ئاگر دەکرێتەوە کە دابەزینەکە بۆ بەکارهێنەر دیار بێت (چاوەڕێی گواستنەوەکانی CSS دەکات، بۆ تەواوبوون).
`hide.bs.dropdown`	ئەم ڕووداوە دەستبەجێ ئاگر دەکرێتەوە کاتێک شێوازی hide instance بانگ کراوە.
`hidden.bs.dropdown`	ئەم ڕووداوە کاتێک ئاگر دەکرێتەوە کە درۆپداونەکە تەواو بوو لە شاردنەوە لە بەکارهێنەر (چاوەڕێی گواستنەوەکانی CSS دەکات، بۆ تەواوبوون).

$('#myDropdown').on('show.bs.dropdown', function () {
  // do something…
})

دابەزینەکان

تێڕوانینێکی گشتی

دەستڕاگەیشتن

نموونە

دابەزینی تاکە دوگمە

دابەزینی دوگمەی دابەشکردن

قەبارەدانان

گۆڕانی وازهێنان

گۆڕانی درۆپڕایت

گۆڕانی درۆپلێفت

بابەتە مینیوەکان

ڕێکخستنی مینیو

سەردێڕی مینیوەکان

دابەشکەری مینیو

فۆڕمی مینیو

بابەتە چالاکەکانی مینیو

بابەتە مینیوەکان لەکارخراوە

بەکارهێنان

لە ڕێگەی تایبەتمەندییەکانی داتا

لە ڕێگەی جاڤاسکڕێپتەوە

`data-toggle="dropdown"`هێشتا پێویستە

بژاردەکان

شێوازەکان

ڕووداوەکان

دابەزینەکان

تێڕوانینێکی گشتی

دەستڕاگەیشتن

نموونە

دابەزینی تاکە دوگمە

دابەزینی دوگمەی دابەشکردن

قەبارەدانان

گۆڕانی وازهێنان

گۆڕانی درۆپڕایت

گۆڕانی درۆپلێفت

بابەتە مینیوەکان

ڕێکخستنی مینیو

سەردێڕی مینیوەکان

سەردێڕی دابەزین

دابەشکەری مینیو

فۆڕمی مینیو

بابەتە چالاکەکانی مینیو

بابەتە مینیوەکان لەکارخراوە

بەکارهێنان

لە ڕێگەی تایبەتمەندییەکانی داتا

لە ڕێگەی جاڤاسکڕێپتەوە

data-toggle="dropdown"هێشتا پێویستە

بژاردەکان

شێوازەکان

ڕووداوەکان

`data-toggle="dropdown"`هێشتا پێویستە