1

I am creating a web app in which I have a table and a checkbox if I check the checkbox I want to show how many numbers of rows are there in my table,

like:

<table>
 <thead>
  <tr>
    <td>
      <input type="checkbox" ng-model="checkall" ng-click="clickcheckall()"/>
    </td>
    <td>other td</td>
  </tr>
 </thead>
 <tbody>
  <tr ng-repeat="somedata in table">
    <td></td>
    <td></td>
  </tr>
 </tbody>
</table>

and here I want to print this

{{showcheckalldata}}

in my controller I have a scope variable

$scope.showcheckalldata='';

what I need to do if I want to print number of columns?

1 Answer 1

3

You can just assign the number of elements in the array,

$scope.showcheckalldata= table.length;

DEMO

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $http) {

   
  $scope.results = [{
    "agence": "CTM",
    "secteur": "Safi",
    "statutImp": "operationnel"
  },
  {
    "agence": "SMS",
    "secteur": "Safi",
    "statutImp": "operationnel"
  }];

  $scope.clickcheckall = function() {
    $scope.showcheckalldata = $scope.results.length;
  }
});
<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script src="https://code.angularjs.org/1.4.7/angular.js"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">


  <table>
     <tr>
    <td>
      <input type="checkbox" ng-model="checkall" ng-click="clickcheckall()"/>
    </td>
    
  </tr>
    <tr>
      <th>Agence</th>
      <th>Secteur</th>
      <th>StatutImp</th>
    </tr>
    <tr ng-repeat="result in results">
      <td>{{result.agence}}</td>
      <td>{{result.secteur}}</td>
      <td>{{result.statutImp}}</td>
    </tr>
  </table>
  <h1>Total rows are : {{showcheckalldata}}</h1>
</body>

</html>

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.