How to calculate a value using checkbox AngularJs in a repeater

Question

I use a ngRepeat with a checkbox and need when I check each item compute the value total of selected items as below:

HTML:

 <tr ng-repeat="ciclo in ciclos">
   <td><input id="idCiclo" type="checkbox" ng-click="computeTotal(ciclo)">
   </td>
   <td>{{ciclo.Quantity}}</td>
   <td>{{ciclo.Value | currency}}</td>
    ...
<tfoot>
 <tr>
  ...
  <td>{{TotalQuantity}}</td>...

Controller:

 $scope.computeTotal = function (ciclo) {
   $scope.TotalQuantity += ciclo.Quantity; //Here I need Add or Subtract a value 
 };

Harris · Accepted Answer · 2017-01-26 17:20:56Z

You should have a property that indicates whether a checkbox has been checked or unchecked so that you can decide to add or subtract.

You would be using ngModel with ngChange (ngClick is usually better for elements that don't have built-in click expectations/behaviors).

Example:

View:

<tr ng-repeat="ciclo in ciclos">
   <td>
        <input class="ciclo" type="checkbox" ng-model="ciclo.checked" ng-change="computeTotal(ciclo)">
   <!-- Note that I took out the ID. IDs should never be used in ngRepeat,
        as it heavily risks multiple elements having the same ID,
        which should ALWAYS be unique.
        A class works much better for collections like this. -->
   </td>
   <td>{{ciclo.Quantity}}</td>
   <td>{{ciclo.Value | currency}}</td>
</tr>

Controller:

$scope.computeTotal = function (ciclo) {
    if(ciclo.checked)
        $scope.TotalQuantity += ciclo.Quantity;
    else
        $scope.TotalQuantity -= ciclo.Quantity;
};

Collectives™ on Stack Overflow

How to calculate a value using checkbox AngularJs in a repeater

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related