2016-05-31 12 views
0

マルチ選択ドロップダウンリストが開いたときに、ドロップダウンリストに値がありません。以下のコードは、plzは任意のブートストラップクラスを追加する必要がある提案する....私はあなたとmultiselect()を実行する必要がangularjsMutiselectドロップダウンが表示されないbootstrap-multiselect.min.jsを使用して

var app = angular.module('myApp', []); 
 
app.controller('customersCtrl', function($scope, $http) { 
 
\t $('#filterName').multiselect(); 
 
    $http.get("http://www.w3schools.com/angular/customers_mysql.php") 
 
    .then(function (response) { 
 
\t \t $scope.names = response.data.records; 
 
    }); 
 
});
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css" /> 
 
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="customersCtrl"> 
 
    
 
<table class="table table-stripped"> 
 
<thead> 
 
\t <tr> 
 
\t \t <th> 
 
\t \t \t <select id="filterName" multiple="multiple"> 
 
\t \t \t \t <option ng-repeat="x in names">{{ x.Name }}</option> 
 
\t \t \t </select> 
 
\t \t </th> 
 
\t \t <th></th> 
 
\t </tr> 
 
</thead> 
 
<tbody> 
 
    <tr ng-repeat="x in names"> 
 
    <td>{{ x.Name }}</td> 
 
    <td>{{ x.Country }}</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
    
 
</div>

答えて

1

を使用して、このドロップダウン値にフィルタを適用する必要がありますディレイ。

var app = angular.module('myApp', []); 
app.controller('customersCtrl', function($scope, $http) { 
    $http.get("http://www.w3schools.com/angular/customers_mysql.php") 
    .then(function(response) { 
     $scope.names = response.data.records; 
    }); 
}); 

setTimeout(function() { 
    $('#filterName').multiselect(); 
}, 300); 
+0

具体的な理由 – Jay

+0

最初にデータをフェッチしてから、複数選択を実行する必要があります。あなたのコードでは、データを取得する前に 'multiselect()'を実行するので、あなたの選択に名前がないのです。 – makshh

+0

助けてくれてありがとう...あなたはブートストラップで良いと思われる.... http://stackoverflow.com/questions/37531152/bootstrap-columns-reordering-issues – Jay

関連する問題