CODEWITHSUNDEEP
javascriptangularjstwitter-bootstrap-3drop-down-menubootstrap-select
Rk R Bairi
Rk R Bairi

Reputation: 1359

angular select box not displaying in mozilla, Internet explorer (bootstrap-select)

I have the following select box appearing in chrome but not in other browsers Using bootstrap-select (1.12.2 V) to style the select box.

options.html

<select ng-model="ctrl.qSettings.env" 
        ng-change="ctrl.envChanged()"
        class="selectpicker"
        data-width="fit">
<option style="color: #5cb85c;" 
        ng-repeat="env in ctrl.qSettings.envs">{{env}}
</option>
</select>

html 

<!DOCTYPE html>
<html lang="en" ng-app="app">

  <head>
     <link rel="stylesheet 
     href="node_modules/bootstrap/dist/css/bootstrap.min.css">
     <-- bootstrap select -->
     <link rel="stylesheet" 
     href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap 
     select/1.12.2/css/bootstrap-select.min.css">  
     <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-
     select/1.12.2/js/bootstrap-select.min.js"></script>
 </head>
 <body ng-controller="abcCtrl as ctrl">

   <div ng-include="'templates/options.html'"></div>

   <script src="node_modules/bootstrap/dist/js/bootstrap.js"></script>
   <-- ui select -->
   <script src="node_modules/ui-select/dist/select.min.js"></script>
   <link rel="stylesheet" href="node_modules/ui-select/dist/select.min.css">
 </body>
</html>

Can you please guide me on what would be wrong here,Thanks.

Upvotes: 0

Views: 71

Answers (1)

zebos
zebos

Reputation: 11

Try ng-options.

<select ng-model="ctrl.qSettings.env" 
        ng-change="ctrl.envChanged()"
        class="selectpicker"
        data-width="fit"
    ng-options="env in ctrl.qSettings.envs">

</select>

Upvotes: 1

Related Questions