angularjs - Check-all checkbox is not changes object properties from select -
i'm trying changes status of list objects using master checkbox checks objects , changes properties selecting required status select element.
the problem when i'm trying apply change on elements using "check all" 'checkbox' not working.
e.g.
when check manually checkboxes without using master checkbox working.
my code
var webapp = angular.module('webapp', []); //controllers webapp.controller ('votesctrl', function ($scope, votes) { $scope.votes = votes; $scope.statuses = ["approved","pending","trash","spam"]; $scope.expand = function(vote) { console.log("show"); $scope.vote = vote; $scope.ip = vote.ip; $scope.date = vote.created; }; $scope.change = function() { for(var = 0; < $scope.votes.length; i++) { if($scope.votes[i].cb) { $scope.votes[i].status = $scope.votes.status; $scope.votes[i].cb = false; } $scope.show = false; } }; }); //services webapp.factory('votes', [function() { //temporary repository till integration db translated restful query var votes = [ { id: '1', created: 1381583344653, updated: '222212', ratingid: '3', rate: 5, ip: '198.168.0.0', status: 'pending', }, { id: '111', created: 1381583344653, updated: '222212', ratingid: '4', rate: 5, ip: '198.168.0.1', status: 'spam' }, { id: '2', created: 1382387322693, updated: '222212', ratingid: '3', rate: 1, ip: '198.168.0.2', status: 'approved' }, { id: '4', created: 1382387322693, updated: '222212', ratingid: '3', rate: 1, ip: '198.168.0.3', status: 'spam' } ]; return votes; }]); my html
<body ng-controller='votesctrl'> <div> <ul> <li class="check" ng-click=> <input type="checkbox" ng-model="master"></input> </li> <li class="created"> <a>created</a> </li> <li class="ip"> <b>ip address</b> </li> <li class="status"> <b>status</b> </li> </ul> <ul ng-repeat="vote in votes"> <li class="check"> <input type="checkbox" ng-model="vote.cb" ng-checked="master"></input> </li> <li class="created"> <a href="#" ng-click="expand(vote)">{{vote.created|date}}</a> </li> <li class="ip"> {{vote.ip}} </li> <li class="status"> {{vote.status}} </li> </ul> </div> <br></br> <div class="details"> <h3>details:</h3> <div>date: {{date|date}}</div> <div>ip: {{ip}}</div> <div>status: <select ng-change="change()" ng-init="votes.status='approved'" ng-model="votes.status" ng-options="status status in statuses"> </select> <p>{{vote.status|json}}</p> </div> </div> </body> why master checkbox not working?
i changed method change bit make work.
from plunker can see on master change children still have old value. added onmasterchange method
html
<input type="checkbox" ng-model="master" ng-change="onmasterchange(master)"></input> i created default: $scope.master = false;
.... $scope.master = false; $scope.onmasterchange = function(master){ for(var = 0; < $scope.votes.length; i++) { $scope.votes[i].cb = master; } }; $scope.change = function(value) { for(var = 0; < $scope.votes.length; i++) { //if($scope.votes[i].cb == undefined){ // $scope.votes[i].cb = false; // } if($scope.master == true){ $scope.votes[i].cb = $scope.master; $scope.votes[i].status = value; } else if( $scope.votes[i].cb == true) { $scope.votes[i].status = value; } } }; see plunker
hope help,
Comments
Post a Comment