Search code examples
htmlangularjsmeanjs

How Do I Sum the Total Of The Column Values If filtering the pending values in Angularjs?


I am using MEAN stack in my application with AngularJS as my front-end. How to total sum column values, if some value is filtered in the table, actually I got the total sum value but if I do filter like | filter:{status: 'pending'} in the table total sum gets overall data values...My Plunker For Example :- in table without filter the amt values total sum answer I got 5775.30, then in table if I have used filter like | filter:{status: 'pending'} amt values total sum is showing like overall value 5775.30, Expecting answer like 3850.2 , If any one knows the solution help to us thanks....

  • In table column without filter we got an exact answer and total sum also.

  • But in table, if used filter | filter:{status: 'pending'} again showing overall data values ... so what we expecting if we used filter the total sum should be calculate rest of the values ...expecting amt answer like 3850.2...please look at my plunker

My controller:-

    .filter('sumOfValue', function () {
    return function (data, key) {
        debugger;
        if (angular.isUndefined(data) && angular.isUndefined(key))
            return 0;        
        var sum = 0;

        angular.forEach(data,function(v,k){
            var keyval;
      if(isNaN(parseFloat(v[key])))
      keyval=0;
      else
      keyval=parseFloat(v[key]);
      sum = sum + keyval;
        });        
        return sum.toFixed(2);
    }
})

My Html:-

    <td >{{mani.amt}}</td>

      <td >{{mani.amount_payment }}</td>

<td >{{mani.status }}</td>

My filter:-

| filter:{status: 'pending'}

My Data:-

            {
"_id": "5816f4fad0be79f809519f98",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-10-31T07:38:34.999Z",
"remarks": "-",
"status": "pending",
"amt": "1925.10",
"cheque_currency": "Rs",
"cheque_value": "300",
"amount_payment": "100",
"debitnote_no_payment": "3",
"supplier_name": "karikalan",
"status": "pending",
"buyer_name": "Manidesigns"
},

{
"_id": "5816f4fad0be79f809519f98",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-10-31T07:38:34.999Z",
"remarks": "-",
"status": "pending",
"amt": "1925.10",
"cheque_currency": "Rs",
"cheque_value": "300",
"amount_payment": "100",
"debitnote_no_payment": "3",
"supplier_name": "karikalan",
"status": "received",
"buyer_name": "Manidesigns"
},

{
"_id": "5816f4fad0be79f809519f98",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-10-31T07:38:34.999Z",
"remarks": "-",
"status": "pending",
"amt": "1925.10",
"cheque_currency": "Rs",
"cheque_value": "300",
"amount_payment": "",
"debitnote_no_payment": "3",
"supplier_name": "karikalan",
"status": "pending",
"buyer_name": "Manidesigns"
},

I have created with below given answer updated:- Plunker


Solution

  • Can you change your tr ng-repeat to below , you have not assigned filtered value to resultValue

    <tr ng-repeat="mani in resultValue=((sryarndebitnote) | filter:{status: 'pending'}) ">