CODEWITHSUNDEEP
javascriptangularjs
user5443928
user5443928

Reputation:

how to get row data of a table when input check box will be selected using angular.js

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.

Upvotes: 0

Views: 2167

Answers (2)

Abhilash Augustine
Abhilash Augustine

Reputation: 4208

<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...

Upvotes: 1

Tanvee Gujral
Tanvee Gujral

Reputation: 34

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.

Upvotes: 0

Related Questions