I have some angular.js code that populates an array when a user clicks on some checkboxes. I generate a list of checkboxes with an 'ng-repeat' and I need to save an array to the server side when a user submits a form. I have this code and it works.. Fiddle Here However, the checkboxes wont stay 'checked'? does anyone have any advice on how to fix this UI bug?
html
<div ng-controller="MyCtrl">
<div class="col-sm-6">
<div class="form-group">
<label>Search by Organism :</label>
<input type="text" class="form-control" placeholder="Organism" ng-model="filterText">
</div>
<div class="well" style="max-height: 250px; overflow: auto;">
<ul class="list-group checked-list-box" ng-repeat="x in organisms | filter: filterText">
<label>
<input type="checkbox" ng-change="match($index)" ng-model="orgs[$index]">
</label>
</ul>
</div>
</div>
</div>
angular
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.orgs = [];
$scope.match = function(index) {
console.log("index", index);
console.log("organism: ", $scope.organisms[index]);
$scope.orgs[index] = $scope.organisms[index];
};
$scope.organisms = ["Pseudomonas aeruginosa", "Stenotrophomonas maltophilia", "Pseudomonas luteola", "Pseudomonas aeruginosa", "Streptococcus pneumoniae", "Candida tropicalis", "IAV-H1N1", "IAV-H1N2", "IAV-H3N2", "IAV-mixed", "IAV-H10N8", "IAV-H2N2", "IAV-H5N1", "IAV-H5N6", "IAV-H7N3", "IAV-H7N7", "IAV-H7N9", "IAV-H9N2"];
}
Aucun commentaire:
Enregistrer un commentaire