Hi All, I am learning AngularJS and webapi. I have a search form and am
trying to display data with selected checkbox. My code works with radio
button but not checkbox. Can anyone help me with checkbox? Thanks. Below is
my code:
var app=angular.module('TEST',[]);
app.controller('MYController', function ($scope, $http)
{
$http.get('http://LOCALHOST/api/schedule')
.then(function successCallback(response){
$scope.schedules = response.data;
});
})
.filter('CAMPUS_NAME',function(){
return function(schedules, CAMPUS_NAME){
if (!CAMPUS_NAME){
return schedules;
}
var arr=[];
angular.forEach(schedules, function(v){
// if (v.CAMPUS_NAME=== CAMPUS_NAME){ //works for radio
if (v.CAMPUS_NAME.selected){ //does not work for checkbox
arr.push(v);
}
})
return arr;
}
})
index.html code:
<!DOCTYPE html>
<html >
<head>
<script data-require="angular.js@*" data-semver="1.6.1"
src=
"https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js">
</script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="TEST" ng-controller="MYController as MYCtrl">
<h1>Schedule </h1>
<div >
<div>
Campus:<br />
<input type="radio" value="A" ng-model="searchCampus">A<br/>
<input type="radio" value="B" ng-model="searchCampus">B<br/>
<input type="radio" value="C" ng-model="searchCampus">C<br/>
<label>A:
<input type="checkbox" ng-model="searchCampus.selected"
name="searchCampus" ng-true-value="'A'" ng-false-value="" >
</label><br/>
<label>B:
<input type="checkbox" ng-model="searchCampus.selected" value="B"
>
</label><br/>
</div>
<div ng-repeat="item in schedules|CAMPUS_NAME:searchCampus" >
campus: {{item.CAMPUS_NAME}} <br />
classno: {{item.CLASS_NBR}} <br />
subject: {{item.SUBJECT}}
</div>
</div>
</body>
</html>
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.