How to change the color of a row in ng-repeat table when checkbox is clicked in angularjs.
How to change the color of the row to green color when the checkbox is clicked and how to disable the texbox after clicking on the checkbox and also how to disable checkbox after clicking on the checkbox.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular-animate.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular-aria.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular-messages.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-chart.js/1.0.3/angular-chart.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular-route.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/ngstorage/0.3.6/ngStorage.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angucomplete-alt/3.0.0/angucomplete-alt.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<div class="bg-white mb-1">
<div class="row m-1 p-1" ng-repeat="item in mydata">
<div class="col-md-1 pull-left airways-info-sect">
<span class="fli-code">Serial No</span>
<span class="airways-name" style="text-align:center;">{{$index + 1}}</span>
</div>
<div class="col-md-4 pull-left airways-info-sect">
<span class="fli-code">Part Name</span>
<span class="airways-name" style="text-align: left;">{{item.PartName}}</span>
</div>
<div class="col-md-1 pull-left airways-info-sect">
<span class="fli-code">Accept Qty</span>
<span class="airways-name" style="text-align:right;">{{item.Numbers | number}}</span>
</div>
<div class="col-md-1 pull-left airways-info-sect">
<span class="fli-code">Issued Qty</span>
<span class="airways-name" style="text-align:right;">{{item.IssuedQty | number}}</span>
</div>
<div class="col-md-1 pull-right airways-info-sect">
<span class="fli-code" style="text-align:center">Amount($)</span>
<span class="airways-name" style="text-align:right;" ng-model="item.CurrencyAmount">{{item.CurrencyAmount | number}}</span>
</div>
<div class="col-md-1 pull-right airways-info-sect">
<span class="fli-code">Select</span>
<span class="airways-name" style="text-align:center">
<input type="checkbox" class="" ng-change="copy($index)" ng-model="item.hasChecked" /></span>
</div>
<div class="col-md-3 pull-left airways-info-sect">
<span class="fli-code">Receipt Amount($)</span>
<input type="text" class="" placeholder="" ng-model="item.replica" ng-init="item.replica=0" required="" style="border: 1px solid #333; width: 90%; text-align: right" />
</div>
</div>
</div>