如何使用angular.js选中输入复选框时如何获取表的行数据

Question

I need one help.I need to fetch the list of row data when check box will be select using angular.js.I am explaining my code below.

<tbody id="detailsstockid">
  <tr ng-repeat="p in viewIncompleteData">
    <td>
       {{$index+1}}<input type="checkbox" ng-model="checkboxModel.value1">   
    </td>
    <td>
       {{p.Product_name}}
    </td>
    <td>
       {{p.Discount}}
    </td>
    <td>
       {{p.Offer}}
    </td>
    <td>
       {{p.unit_cost_price}}
    </td>
    <td>
       {{p.unit_sale_price}}
    </td>
    <td>
       {{p.quantity}}
    </td>
    <td> 
    </td>
  </tr> 
</tbody>

<div style="text-align:center; padding-top:10px;" ng-show="updateButton">
   <input type="button" class="btn btn-success" ng-click="UpdateProductstockData();"  id="addProfileData" value="Add Total"/>
</div> 

When user will click on Add Total button first it will check the validation if any check box is selected or not.When any check box will select the respective row data will fetch inside the click event function.Please help me.

Answer 1

<tbody id="detailsstockid">
    <tr ng-repeat="p in viewIncompleteData">
    <!-- Added new property to your scope variable viewIncompleteData -->
    <td>{{$index+1}}<input type="checkbox" ng-model="p.isChecked">  </td> 
    <td>{{p.Product_name}}</td>
    <td>{{p.Discount}}</td>
    <td>{{p.Offer}}</td>
    <td>{{p.unit_cost_price}}</td>
    <td>{{p.unit_sale_price}}</td>
    <td>{{p.quantity}}</td>
    <td> 
  </td>
    </tr>   
    </tbody>

<div style="text-align:center; padding-top:10px;" ng-show="updateButton">
<input type="button" class="btn btn-success" ng-click="UpdateProductstockData();"  id="addProfileData" value="Add Total"/>
 </div>

And now you can check your variable viewIncompleteData[i].isChecked to know which are checked.

$scope.UpdateProductstockData = function(){
    angular.forEach($scope.viewIncompleteData, function(value, index){
        if(value.isChecked){
            // this row is selected
        }
    });
}

Hope this will helps you...

Answer 2

According to me, you should take an array to track the checkbox values of respective column (like ng-model="checkboxModel.value1[$index]"). now when your ADD TOTAL button will be clicked call a function. Function should be like this:

function(){
 for(var i=0;i<$scope.viewIncompleteData.length;i++){
  if(checkboxModel.value1[i]==true){
   var data=$scope.viewIncompleteData[i];
  }
 }
}

Now data is your fetched row data when checkbox is checked.