Search code examples
angular-ui-select

How to remove double box - Angular UI Select


I get double boxes for drop down list in Chrome, Safari and Firefox. How can I remove the box below?

<ui-select ng-required="isPriceChoiceExist" name="size" ng-model="selected.productPriceId">
    <ui-select-match placeholder="Select Size">{{$select.selected.displayDesc}}</ui-select-match>
    <ui-select-choices repeat="s.priceId as s in product.regularPriceChoices | filter: $select.search">
        <div ng-bind-html="s.displayDesc | highlight: $select.search"></div>
    </ui-select-choices>
</ui-select>

Please refer to the image below.

enter image description here


Solution

  • This was introduced when I added angular-mobile-ui Angular Mobile UI. The bootstrap class .dropdown-menu { display: none} is overwritten with .dropdown-menu { display: block} in angular-mobile-ui.