根据html表格单元格值隐藏行
问题描述:
我有一个显示数据库数据的表,我有一个具有简单算术功能的单元格。
我想隐藏总和为零的整行(如果$ sold值为零)。
I have a table that displays data from database and i have a cell with a simple arithmetic function. I want to hide the entire row where the result of the sum is zero(if $sold value is zero).
<input type="button" id="btnHide" Value=" Hide Empty Rows " />
...
<tbody>
<?php }
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
$sold=$row['value1']+$row['value2']);
{ ?>
<tr>
<td><?php echo $row['contract'] ?></td>
<td><?php echo (round($row['value1'], 2)) ?></td>
<td><?php echo (round($row['value2'],2 )) ?></td>
<td><?php echo ((round($sold, 2))+0) ?></td>
</tr><?php } } ?>
</tbody>
我发现了一些隐藏所有行的代码它有空单元格,但它不是我想要的。请求帮助。
I found some code to hide all rows where it have empty cells, but it's not what i want. Thx for help.
$(document).ready(function() {
$("#gdRows td").each(function() {
var cellText = $(this).text();
if ($.trim(cellText) == '') {
$(this).css('background-color', 'cyan');
}
});
$('#btnHide').click(function() {
$("#gdRows tr td").each(function() {
var cell = $.trim($(this).text());
if (cell.length == 0) {
$(this).parent().hide();
}
});
});
$('#btnReset').click(function() {
$("#gdRows tr").each(function() {
$(this).show();
});
});
});
答
为了简化而向这些单元格添加一个类
Add a class to those cells for simplification
<td class="sold"><?php echo ((round($sold, 2))+0) ?></td>
然后使用 filter()
$("td.sold").filter(function() {
return +$(this).text().trim() === 0;
}).parent().hide();
你也可以在php中做同样的事情如果 $ sold
为零,则为行添加隐藏
类,并为添加css规则隐藏
类
You could also do the same thing in php by adding a hidden
class to the row if $sold
is zero and add a css rule for hidden
class
PHP
<tr class="<?= $sold == 0 ? 'hidden' :'';?>">