Get selected data from checkbox in a form

Question

I have a form with multiple checkboxes where I display checkbox data from a JSON file using ng-repeat. Now, when I submit the form, I want to get the checked data from the checkboxes. How can I access checked data after the form is submitted? I did some research and now I can display the checked data on page itself using ng-model="s.checked" but how can I access the checked data at controller's end.

See this Plunk for details

Answer 1

The structure of $scope.List hasn't changed when you submit, it's still an array of objects. You could do something like

$scope.submit = function() {
    var checkedItems = $scope.List.filter(function(item){
        return item.checked;
    });
    console.log(checkedItems);
};

The values of the List items have changed.

(Also, it's generally a good idea to use ngSubmit )

Answer 2

You have array of objects:

$scope.list = [
{"ID":5000,"Name":"ABC",checked:true},
{"ID":5001,"Name":"DEF",checked:false},
{"ID":5002,"Name":"XYZ",checked:false}];

so you can access the values of checked properties like this:

$scope.submit = function() {
    var val1 = $scope.list[0].checked;
    var val2 = $scope.list[1].checked;
    var val3 = $scope.list[2].checked;
}

Or with the use of forEach statement:

$scope.submit = function() {
    angular.forEach($scope.list, function (listValue) {
       var val = listValue.checked;
    });
}