So, I have this html table, with a checkbox as the last column (id = reconciled), I also have an id field in the first column (id = aopayid) , how do I check the last column and get the first column value, I also want to uncheck and get the first column value - they must be as I click each checkbox and I need the check and uncheck to be separate as I will run a separate script for each.
I have found a few solutions, but they all seem to loop through the table and give the value of each that are checked, or unchecked. Hope that makes sense.
<table id="example" class="display" style="width:100%;display:none" >
<thead>
<tr>
<th >AoID</th>
<th>Merchant</th>
<th >Reference</th>
<th >Date</th>
<th style=" text-align: right">Amount</th>
<th >Status</th>
<th >Edit</th>
<th >Complete</th>
</tr>
</thead>
<tbody>
<tr>
<td name="aopayid" id="aopayid" ></td>
<td></td>
<td></td>
<td><span class="date"><?php echo substr($transaction->created,0,10); ?></td>
<td style=" text-align: right"><?php echo number_format($transaction->amount,2); ?></td>
<td><span class="badge "></span></td>
<td><input type="button" class="edit" name="edit" value="Edit" ></td>
<td><input type="checkbox" class="reconciled" name="reconciled" id="reconciled" value = 'yes' ></td>
</tr>
</tbody>
</table>
The code that I have is as follows , but it does not give the value when unchecking
$(document).on("click", "#example .reconciled", function () {
//Reference the Table.
var grid = document.getElementById("example");
//Reference the CheckBoxes in Table.
var checkBoxes = grid.getElementsByTagName("INPUT");
var message ;
var checkedornot;
//Loop through the CheckBoxes.
for (var i = 0; i < checkBoxes.length; i++) {
if (checkBoxes[i].checked) {
var row = checkBoxes[i].parentNode.parentNode;
message = row.cells[0].innerHTML;
checkedornot = 'Yes';
}
}
alert(message );
});
Aucun commentaire:
Enregistrer un commentaire