JSFiddle - React, Tailwind, and code Playground

by Athul Nair

HTML

<div ng-app ng-controller="mainController">
  <table>
    <tr>
      <th>
        <input type="checkbox" ng-model="selectAll" ng-click="selectAllCheckBox(selectAll)">
      </th>
      <th>Name</th>
      <th>Correct</th>
      <th>Wrong</th>
    </tr>
    <tr ng-repeat="studentA1 in studentsA1">
      <td>
        <input type="checkbox" ng-model="studentA1.selected">
      </td>
      <td> {{studentA1.Name}}</td>
      <td>
        <input type="number" ng-model="studentA1.Correct" />
      </td>
      <td>
        <input type="number" ng-model="studentA1.Wrong" />
      </td>\
    </tr>
  </table>
  <br> {{selectedStudentsA1}}
  <a ng-click="selectedStudents()">Submit</a>
</div>

JavaScript

function mainController($scope) {
  $scope.studentsA1 = [{
    selected: false,
    Name: 'Akhilesh',
    Correct: '',
    Wrong: ''
  }, {
    selected: false,
    Name: 'Prathamesh',
    Correct: '',
    Wrong: ''
  }, {
    selected: false,
    Name: 'Mandar',
    Correct: '',
    Wrong: ''
  }, {
    selected: false,
    Name: 'Sunmay',
    Correct: '',
    Wrong: ''
  }];

  $scope.selectedStudents = function() {
    $scope.selectedStudentsA1 = $scope.studentsA1.filter(i => i.selected == true);
    $scope.correctAnswers = $scope.selectedStudentsA1.length;
    $scope.incorrectAnswers = $scope.studentsA1.length - 		         $scope.selectedStudentsA1.length;
  }
  $scope.selectAllCheckBox = function(value) {
    $scope.studentsA1.forEach(function(item) {
      item.selected = value;
    });
  }

}