css - How to do split select like ui bootstrap slipt dropdown -


i want split normal selectbox should default ui bootstrap dropdown. have used uibootstrap dropdown, problem selected dropdown value not displayed on top normal dropdown do.

please let me know how split select.?

you can use current selected item button label ui bootstrap split button this:

<!-- split button --> <div class="btn-group dropdown" uib-dropdown="" style="">   <button id="split-button" type="button" class="btn btn-danger">{{selecteditem || 'choose item'}}</button>   <button type="button" class="btn btn-danger dropdown-toggle" uib-dropdown-toggle="" aria-haspopup="true" aria-expanded="true">     <span class="caret"></span>   </button>   <ul uib-dropdown-menu="" role="menu" aria-labelledby="split-button" class="dropdown-menu">     <li role="menuitem" ng-repeat="item in items" ng-click="selectitem(item)"><a href>{{item}}</a></li>   </ul> </div> 

and in controller:

$scope.items = ['action 1','action 2','action 3'];  $scope.selectitem = function(item) {   $scope.selecteditem = item; } 

see plnkr: http://plnkr.co/edit/rzomoa2t3jzdniz3eqow?p=preview


Comments

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

reactjs - React router and this.props.children - how to pass state to this.props.children -

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -