How to bind dynamic Check boxes value using ng-model?

Question

I want to put the values of dynamic checkboxes (not boolean true and false) in the form of array using \'ng-model\' in a similar way as is done using \'name\' attribute. This ar

Answer 1

You have to bind each input to a different value. Currently all of them are bound to the field operations in the scope via ng-model="operations".

I suggest you create an array operations in your controller like this:

$scope.operations = new Array($scope.operations_publish.length);

Then you can bind the checkboxes to the respective index in this array:

<span ng-repeat="operation in operations_publish">
    <input type="checkbox"
           name="operations"
           ng-model="operations[$index]"
           value="{{operation}}"/>
    {{operation}}
</span>

This will give you an array with true at all checked indexes. If you then want the selected values as strings in an array, you can collect them like this:

function getSelected() {
    return $scope.operations_publish.filter(function (x,i) {
        return $scope.operations[i]
    });
}

Check this fiddle for the complete code.

Answer 2

According to your example listed there, you have bound your ng-model to the expression operations, however you need to be binding it to the individual iterator operation (from) ng-repeat="operation in operations_publish".

You can then set that data in your dataLog object:

var dataObj = {
    "operationType" : $scope.operationType,
    "conceptModelID" : $scope.conceptID,
    "requestor" : $scope.requestor,
    "status" : "new",
    "requestDateTime" : null,
    "lastExecutedDateTime" : null,
    "completedDateTime" : null,
    "instructions" : $scope.operations_publish
};

Data binding by default in angular are multi-directional therefore:

1. operations_publish => bound to row via iterator operation
2. operation => bound to checkbox value via ng-model
3. When the value of the checkbox changes, you change the variable it was bound to, and the collection that variable iterated from.

Answer 3

did you try ?

<input type="checkbox" ng-model="cbValues[$index]"
    ng-repeat="value in cbValues track by $index" />

Works for me : http://plnkr.co/edit/s0rZiMeL4NvpFZ3C9CIL?p=preview