I would like to show the state of checkboxes that are selected by the user as checked when I load the page after the data has been saved in the mysql db.
I am using the following code but I am unable to set it:
<div class="btn-group " ng-repeat="room in classrooms">
<label class="btn btn-default" ng-model="checkModel[room.Id]"
uib-btn-checkbox>
</label>
</div>
Controller:
//this binds the data
Organisation.getAllClassrooms().then(
function(data){
$scope.classrooms = data.data;
}
)
$scope.checkResults = [];
$scope.$watchCollection('checkModel', function () {
$scope.checkResults = [];
angular.forEach($scope.checkModel, function (value, key) {
if (value) {
$scope.checkResults.push(key);
}
});
});
$scope.Save = function()
{
var selClassrooms ='';
for (var i = 0; i < $scope.checkResults.length; i++)
{
selClassrooms+=$scope.checkResults[i]+':';
}
... do the save to db
}
... I save in the db (14:15:18) by getting the selected id which is fine
I then need to show which ones have been selected when loading the page again.
To do this I retrieve the data from the service and convert it to array like below:
$scope.selrooms = data.data[0]['ActivityReportClassrooms'].split(':');
now how can I create the object model so it sets the state of the 15,15,18 buttons to be checked?
I can hardcode it like below and it sets it correctly but I need to loop through the $scope.selrooms and then check the ones that have been saved by the user :
$scope.checkModel = {};
$scope.checkModel = {
14: true,
4: false,
18: true
};
Aucun commentaire:
Enregistrer un commentaire