After populating a table with data from a CSV file, users have the ability to select specific rows. When they click submit, all selected row data is sent to a webservice.
Although I have successfully implemented AngularJS(v1.6) to populate the data and retrieve individual row data on checkbox click, I am facing an issue where the .checked property returns false if not all rows are selected. Consequently, unchecking a row does not remove its value as expected.
Below is the code snippet:
$scope.getRow = function(n,item){
var selectedRows = [];
console.log(item);
console.log(document.getElementById("checkboxValue").checked);
//will push all selected items to selectedRows
}
<table id="customers">
<tr>
<th></th>
<th ng-repeat="(key,data) in tableData[0]">{{key}}</th>
</tr>
<tr ng-repeat="item in tableData">
<td><input type="checkbox" id="checkboxValue" ng- click="getRow(this,item)" /> </td>
<td ng-repeat="(key,data) in item"> {{data}}</td>
</tr>
</table>
<button ng-click="executeQuery()">Execute</button>
The table will look like https://i.sstatic.net/BCaug.png