JSFiddle - React, Tailwind, and code Playground

by Gaurav Singh

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-repeat="item in myArray">
  <input ng-model="item.selected" ng-click="checkItem(item)" type="checkbox" />{{ item.name }} - {{item.id}}({{item.part}})
</div>

JavaScript

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.checkItem = function(item) {
    if (item.selected) {
      var otherExists = $scope.myArray.filter(function(m) {
        return ((m.part != item.part) && m.selected);
      }).length;
      var selfExists = $scope.myArray.filter(function(m) {
        return ((m.part == item.part) && m.selected);
      }).length - 1;
      if (!!otherExists) {
        if (!!selfExists) {
          var selectedIsLower = $scope.myArray.filter(function(m) {
            return ((m.part == item.part) && (m.id > item.id) && m.selected);
          }).length;
          if (!!selectedIsLower) {
            item.selected = false;
          } else {
            $scope.myArray.filter(function(m) {
              return (m.part == item.part);
            }).forEach(function(m) {
              m.selected = false;
            });
            item.selected = true;
          }
        } else {
          item.selected = false;
          var allSelectedIds = [];
          var allSelected = $scope.myArray.filter(function(m) {
            return m.selected;
          });
          allSelected.map(m => m.part).forEach(function(a) {
            if (allSelectedIds.indexOf(a) < 0) {
              allSelectedIds.push(a);
            }
          });;
          if (allSelectedIds.length == 1) {
            var maxEle = {};
            allSelected.forEach(function(m, count) {
              if (maxEle.id) {
                (maxEle.id > m.id) && (m.selected = false);
              }
              maxEle.id = m.id;
              maxEle.count = count;
            });
          }
          item.selected = true;
        }
      }
    }
  };

  $scope.myArray = [{
    "id": 77,
    "selected": true,
    "part": 33,
    "name": "16.1",
  }, {
    "id": 76,
    "part": 30,
    "selected": true,
    "name": "14.3",
  }, {
    "id": 71,
    "part": 30,
    "selected": false,
    "name": "14.2",
  }, {
    "id": 70,
    "part":...