I have a table like below
<table id="mytable">
<tr><th>checked</th><th>id</th><th>text</th></tr>
<tr><td><input id="cb1" type="checkbox" name="checker1"/></td><td>123</td><td>abc</td></tr>
<tr><td><input id="cb1" type="checkbox" name="checker1"/></td><td>456</td><td>def</td></tr>
<tr><td><input id="cb1" type="checkbox" name="checker1"/></td><td>789</td><td>ghi</td></tr>
</table>
I want to retrieve (using jquery) a javascript array of all checked ID's in the table.
So far I have the following jquery code which on the click of the jqcc button brings me an alert box for each of the checked items, so instead of alert, i need to retrieve the value of the second td and add it to an array,
$(document).ready(function() {
var tableControl= document.getElementById('mytable');
$('#jqcc').click(function() {
$('input:checkbox:checked', tableControl).each(function() {
alert('checked');
});
});
});
You should do
$(document).ready(function() {
var tableControl= document.getElementById('mytable');
var arrayOfValues = [];
$('#jqcc').click(function() {
$('input:checkbox:checked', tableControl).each(function() {
arrayOfValues.push($(this).closest('tr').find('td:last').text());
}).get();
});
});
arrayOfValues
will hold the text inside the last td.
EDIT of course you could also use map
$(document).ready(function() {
var tableControl= document.getElementById('mytable');
var arrayOfValues = [];
$('#jqcc').click(function() {
arrayOfValues = $('input:checkbox:checked', tableControl).map(function() {
return $(this).closest('tr').find('td:last').text();
});
});
});
I want to retrieve (using jquery) a javascript array of all checked ID's in the table.
Try:
var ids = $("#mytable tr:has(input:checked)").map(function() {
var $tr = $(this);
var id = $tr.find("td:last").text();
return id;
}).toArray();
alert(ids.join(", "));
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With