Pentolan Pentolan - 11 days ago 5
jQuery Question

how to use .find properly in jquery for get value

Hello can someone know is it possible to do this?

$(document).ready(function(){
$('body').delegate('#check-hide-empty-table', 'click', function(){
if ($(this).is(':checked')) {
alert("checked")
$('table').find('tr td.test').parents('tr').hide();
}
else {
alert("uncheck")
$('table').find('tr td.test').parents('tr').show();
}
});


and php file like this

</script>
<table id="myTable" class="table table-responsive table-hover table-striped table-fixed tablesorter">
<thead>
<th><input type="checkbox" value="hide" id="check-hide-empty-table"> Hide Empty</th>
</thead>

<tbody>
<?php
$first = false;
foreach ($data["data"] as $list) {
$isfull = $list["Players"] == $list["MaxUsers"] ? true : false;
?>

<tr class="tabClicker" data-tab="tabs-1" id="<?=$list["Id"];?>">
<td class= "test"><?= $list["Players"]."/".$list["MaxUsers"];?></td>
</tr>
<?php } ?>
</tbody>
</table>


what i want to do is, i wanna create hidden chechbox function when $list["player"] = 0 but i'm confuse how to that so i tried to use take value .find(tr td.test) and if .find(tr td.test) = 0, that table will be hidden

how to do that? this code now still error. thanks for any help

Answer

Firstly note that the delegate() method is deprecated. You should use on() instead. If you're using any version of jQuery older than 1.7 you'll need to upgrade it, ideally to at least 1.12.

You should also use the change event when dealing with radio buttons and checkboxes for better accessibility.

To solve your actual issue you can use filter(), like this:

$('#myTable').on('change', '#check-hide-empty-table', function() {
    $('table').find('tr td.test').filter(function() {
        return $(this).text().trim() == "0";
    }).parents('tr').toggle(!this.checked);
});

In this example I negated the need for the if statement by providing the boolean value from the checked property to the toggle() method.

Working example

Comments