By default, tabindex
is set to -1
:
<div class="text-right"> <%= dropdown ['Dropdown 1', id => 'a_custom_id', right, items => [ ['Item 1', ['item1'] ], ['Item 2', ['item2'] ], [], ['Item 3', ['item3'] ] ] ] %> </div>
<div class="text-right"> <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="a_custom_id" data-toggle="dropdown">Dropdown 1</button> <ul class="dropdown-menu dropdown-menu-right"> <li><a class="menuitem" href="item1" tabindex="-1">Item 1</a></li> <li><a class="menuitem" href="item2" tabindex="-1">Item 2</a></li> <li class="divider"></li> <li><a class="menuitem" href="item3" tabindex="-1">Item 3</a></li> </ul> </div> </div>
...but it can be overridden:
<%= dropdown ['Dropdown 2', caret, large, primary, items => [ ['Item 1', ['item1'], data => { attr => 2 } ], ['Item 2', ['item2'], disabled, data => { attr => 4 } ], [], ['Item 3', ['item3'], data => { attr => 7 } ], [], ['Item 4', ['item4'], tabindex => 4 ], 'This is a header', ['Item 5', ['item5'] ], ] ] %>
<div class="dropdown"> <button class="btn btn-lg btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown 2 <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a class="menuitem" href="item1" tabindex="-1" data-attr="2">Item 1</a></li> <li class="disabled"><a class="menuitem" href="item2" tabindex="-1" data-attr="4">Item 2</a></li> <li class="divider"></li> <li><a class="menuitem" href="item3" tabindex="-1" data-attr="7">Item 3</a></li> <li class="divider"></li> <li><a class="menuitem" href="item4" tabindex="4">Item 4</a></li> <li class="dropdown-header">This is a header</li> <li><a class="menuitem" href="item5" tabindex="-1">Item 5</a></li> </ul> </div>