vendredi 7 octobre 2016

Change background color of the row that is checked not selected in angularjs

I have a table generated from ng-repeat. Each of the row has a checkbox. I want the rows which are checked to change their background color. I was trying it using ng-class but did not help, As soon as I select one checkbox, all the rows get their background changed.I understand what the mistake is, but dont know how to solve it.

This is my table

<table >
        <tr>
        <th>Select</th>
        <th>Job List</th>
        <th>Next Firing</th>
        </tr>
         <tr ng-repeat="x in jobs" ng-class-odd="'odd'" ng-class-even="'even'" ng-class="myclass">
            <td style="width: 247px; "><input type="checkbox" ng-model="x.checked" ng-click=countChecked($index)></td>
            <td style="width: 247px; "></td>
            <td style="width: 247px; "></td>
        </tr>
        </table>

This is my controller

$scope.countChecked = function(index){
        var count = 0;
        angular.forEach($scope.jobs, function(job){
            if (job.checked) {
                count++;
                $scope.myclass='selected';

            }
        });
    return count;
    }

I need the "count" for a different purpose, which is working fine.

This is selected css

.selected{
    background-color: #DEB887;

    }




Aucun commentaire:

Enregistrer un commentaire