css - angular bootstrap dropdown to open on left -


i have used angular bootstrap dropdown link. problem dropdown opens on right side. how can make open on left? here markup , js used given link.

markup:

<div ng-controller="dropdownctrl"> <!-- single button keyboard nav --> <div class="btn-group" uib-dropdown keyboard-nav>     <button id="simple-btn-keyboard-nav" type="button" class="btn btn-primary" uib-dropdown-toggle>         dropdown keyboard navigation <span class="caret"></span>     </button>     <ul uib-dropdown-menu role="menu" aria-labelledby="simple-btn-keyboard-nav">         <li role="menuitem"><a href="#">action</a></li>         <li role="menuitem"><a href="#">another action</a></li>         <li role="menuitem"><a href="#">something else here</a></li>         <li class="divider"></li>         <li role="menuitem"><a href="#">separated link</a></li>     </ul> </div> </div> 

js:

angular.module('ui.bootstrap.demo').controller('dropdownctrl', function ($scope, $log) { $scope.items = [ 'the first choice!', 'and choice you.', 'but wait! third!' ];  $scope.status = { isopen: false };  $scope.toggled = function(open) { $log.log('dropdown now: ', open); };  $scope.toggledropdown = function($event) { $event.preventdefault(); $event.stoppropagation(); $scope.status.isopen = !$scope.status.isopen; };  $scope.appendtoel = angular.element(document.queryselector('#dropdown-long-content')); }); 

please help

add class dropdown-menu-right <ul uib-dropdown-menu>.

by default, drowpdown opens aligned left side of parent , growing towards right side. when added class dropdown-menu-right open aligned on right side.


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 -