All boxes checked for form to be valid
Example in Angular where all boxes must be checked in order for the form to be valid.
HTML
<div ng-app="myApp">
<div ng-controller="MyCtrl as vm">
<form name="myForm" ng-submit="vm.mySubmit(myForm.$valid)" novalidate>
<ul>
<li ng-repeat="fruit in vm.fruits">
<label><input type="checkbox" ng-model="vm.checked[fruit]" />{{fruit}}</label>
</li>
</ul>
<div>
<button type="submit" value="Submit">Submit</button>
</div>
</form>
<hr />
<pre>{{vm.checked | json}}</pre>
</div>
</div>
CSS
ul {
list-style: none;
}
JavaScript
angular.module('myApp', []);
angular.module('myApp')
.controller('MyCtrl', function() {
var vm = this;
vm.fruits = [
{data1},
{ oranges1},
{data6},
{data9}
]
vm.checked = {};
vm.isValid = function(check) {
if(check != true) {
return true;
} else {
return false;
}
}
vm.mySubmit = function(data) {
console.log(data);
if(data == false) {
console.log('This form is valid.');
} else {
console.log('This form is invalid.');
}
}
});
// Open the console to see whether the form is valid or not.