how to check if row is invisible

adeveloper · Dec 24, 2008

I have a tbody which is invisible (CSS set to display none). When I am
going through all rows in the whole table, how do I find out which
rows are visible to the user and which are invisible?

All invisible rows are in invisible tbodies. Maybe it is possible to
check if parent (tbody) is visible to determine if a row is visible?

It appears that FireFox does not support current style property.

David Mark · Dec 24, 2008

I have a tbody which is invisible (CSS set to display none). When I am
going through all rows in the whole table, how do I find out which
rows are visible to the user and which are invisible?

How did they get to be "invisible?"

All invisible rows are in invisible tbodies. Maybe it is possible to
check if parent (tbody) is visible to determine if a row is visible?

It appears that FireFox does not support current style property.

But, as with most modern browsers (except IE), it supports
getComputedStyle. IE's "current style" is not appropriate for this as
the cascaded style may not match the computed style.

Bart Van der Donck · Dec 30, 2008

adeveloper said:
I have a tbody which is invisible (CSS set to display none). When I am
going through all rows in the whole table, how do I find out which
rows are visible to the user and which are invisible?

All invisible rows are in invisible tbodies. Maybe it is possible to
check if parent (tbody) is visible to determine if a row is visible?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Visible and invisible rows</title>
<script type="text/javascript">
function visible_rows() {
var r = '';
var obj = document.getElementById('t').getElementsByTagName('tr')
for (var i = 0; i < obj.length; ++i) {
r += 'Row ' + (i+1) + ' = ';
obj.parentNode.style.display == 'none' ? r += 'invisible\n'
: r += 'visible\n'
}
alert(r)
}
</script>
</head>
<body onLoad="visible_rows();">

<table border="1" id="t">
<tbody style="display: none">
<tr><td>one</td></tr>
<tr><td>two</td></tr>
</tbody>

<tbody>
<tr><td>three</td></tr>
<tr><td>four</td></tr>
</tbody>

<tbody style="display: none">
<tr><td>five</td></tr>
</tbody>
</table>

</body>
</html>

Hope this helps,

Check forms With JavaScript	1	Mar 28, 2023
How to add dropdown selected data to table using jquery	2	Jul 2, 2022
HCaptcha - How to stop page from refreshing on submit if captcha is not checked/validated	1	Aug 29, 2023
How to position the tooltip comment on these buttons?	9	Nov 4, 2023
Duplicate ID issue when trying to copy table row	1	Jul 30, 2022
How do I use Find and Loop in VBA for Excel to identify, delete, and insert blank row for values greater than 6?	0	Feb 28, 2022
How to fetch database row and display in Qlabels with QcomboBox selected value in PyQt5	8	Jul 10, 2021
Accessing invisible control in Javascript	1	Sep 25, 2007

how to check if row is invisible

adeveloper

David Mark

Bart Van der Donck

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads