Enable Submit Button If All Checkboxes Are Checked

Question

I am fetching my data from Json tables in form of list.The submit button should be enabled only when all the check boxes are checked. this is my code. Html:

 <ol>
 <li  ng-repeat='box in Box.json'  id='box' >
 <input type="checkbox"  value='{{box.id}}'>{{box.name}}</li>
 </ol>

//Javascript:

 $scope.check=function(){
     return ($scope.check1 && $scope.check2 && $scope.check3)   
  }

The above scope variables are ng-models of each

.But since the data is displayed in list using ng-repeat,I am not able to put ng-model for each and every row from table.Therefore the return statement is not affective and even after checking all checkboxes submit button is not enabled.And I am not supposed to use Jquery.Please Help

Output

Answer 1

I'd just adjust your box object directly and then reduce your array of objects to a boolean value to see if all the checkboxes are checked.

 <ol>
   <li  ng-repeat='box in Box.json'  id='box'>
     <input type="checkbox" ng-model="box.checked"> {{box.name}}
   </li>
 </ol>

And your check function.

$scope.check=function(){
  return $scope.Box.json.reduce(function(prev,value){
    if(!prev) return false;
    return value.checked && true || false;
  },true);
}