CODEWITHSUNDEEP
javascriptangularjs
satya
satya

Reputation: 3560

How to get selected value from table using Angular.js

I need one help.I need some selected value using check box select using Angular.js.I am explaining my code below.

    <tr dir-paginate="pro in listOfReview | itemsPerPage:5">
    <td><input type="checkbox" ng-model="selected[pro.review_id]" ng-false-value="undefined"></td>
    <td>{{$index+1}}</td>
    <td>{{pro.Product_name}}</td>
    <td>{{pro.title}}</td>
    <td>{{pro.description}}</td>
    <td>{{pro.rating}}</td>
     <td ng-if="pro.status==0">Not Approved</td>
    <td ng-if="pro.status==1">Approved</td>
    <td ng-if="pro.status==1">
    <a ui-sref="review">
    <input type='button' class='btn btn-xs btn-red' value='Reject' ng-click="RejectStatus(pro.review_id,pro.status);" >  
    </a>
    </td>
    <td ng-if="pro.status==0">
    <a ui-sref="review">
    <input type='button' class='btn btn-xs btn-green' value='Approve' ng-click="ApproveStatus(pro.review_id,pro.status);" >  
    </a>
     </td>
    </tr>   
 <input type='button' class='btn btn-xs btn-green' value='Approve' ng-click="ApproveStatus();">

The controller side code is given below.

$scope.selected = {};
 $scope.ApproveStatus=function(){
         console.log('approve',$scope.selected);
}

right now i am getting the selected value like this approve Object {4: true} .Here i need to assign pro.review_id value to a key like(review:id:4) so that i can easily fetch those using loop.Here also my requirement is when at least one check box will select the Approve button present at bottom will display to the user.Please help me.

Upvotes: 0

Views: 203

Answers (1)

Muhammad Abid
Muhammad Abid

Reputation: 801

plunker link Click here

You can bind an extra property with check box like I did below.

<!doctype html>
<html ng-app>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
    <script src="script.js"></script>

  </head>
  <body>

    <div ng-controller="Ctrl">

      <table>
        <tr><td></td><td>Name</td><td>Type</td><td>Price</td></tr>
        <tr ng-repeat="p in prods">
          <td><input type='checkbox' value ="p.checked" ng-model="p.checked"></td>
          <td>{{p.name}}</td>
          <td>{{p.type}}</td>
          <td>{{p.price}}</td>
          <td>Delete</td>
          <td>Modify</td>
        </tr>

      </table>

      <input type="button" value="Approve" ng-click="ApproveStatus()" />
    </div>

  </body>
</html>


function Ctrl($scope) {


  $scope.prods = [
    {'id':'0', 'name' : 'Title1', 'type' : 'Zip code', 'price' : '11'},
    {'id':'1', 'name' : 'Title2', 'type' : 'MD', 'price' : '222'},
    {'id':'2', 'name' : 'Title3', 'type' : 'DMS', 'price' : '2222'}
];


  $scope.ApproveStatus = function(){
    console.log('value is:' + $scope.prods.length);
    for(var i =0; i < $scope.prods.length ;i++){
    if($scope.prods[i].checked){
         console.log($scope.prods[i].id)      
      }
    }

  };
}

Upvotes: 1

Related Questions