How to hide table rows with the help of getElementsByName()?

Hi,
How can I hide table rows? ... tried with the following example:
FireFox works... How to do the simillar in IE6?

<html>
<head>
<script language="javascript">
function hide_row() {
var v = document.getElementsByName("trBook");
v[0].style.display = 'none';
v[1].style.display = 'none';
v[2].style.display = 'none';
}
</script>
</head>
<body>
<table>
<tr name="trBook"><td>line1</td></tr>
<tr name="trBook"><td>line2</td></tr>
<tr name="trBook"><td>line3</td></tr>
</table>
<input type=button name="v" value="Hide" onclick="hide_row()">
</body>
</html>

Thanks in advance

AR

Jul 23 '05 #1

Subscribe Post Reply

16884

Martin Honnen

AR wrote:

var v = document.getElementsByName("trBook"); <tr name="trBook"><td>line1</td></tr>
<tr name="trBook"><td>line2</td></tr>
<tr name="trBook"><td>line3</td></tr>

The name attribute is not defined for <tr> elements so you are relying
on browser quirks to give you a result with getElementsByName. Consider
accessing the table and then its rows collection if you want to script
the <tr> elements in that table.
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #2

RobB

AR wrote:

Hi,
How can I hide table rows? ... tried with the following example:
FireFox works... How to do the simillar in IE6?

<html>
<head>
<script language="javascript">
function hide_row() {
var v = document.getElementsByName("trBook");
v[0].style.display = 'none';
v[1].style.display = 'none';
v[2].style.display = 'none';
}
</script>
</head>
<body>
<table>
<tr name="trBook"><td>line1</td></tr>
<tr name="trBook"><td>line2</td></tr>
<tr name="trBook"><td>line3</td></tr>
</table>
<input type=button name="v" value="Hide" onclick="hide_row()">
</body>
</html>

Thanks in advance

AR

document.getElementsByName() is only implemented for input and img
elements in iewin/Opera. Use a TBODY with an id:

function hide_row()
{
var el;
if (document.getElementById
&& (el = document.getElementById('trBook')))
{
el.style.display = 'none';
}
}
..........
<table>
<tbody id="trBook">
<tr><td>line1</td></*tr>
<tr><td>line2</td></*tr>
<tr><td>line3</td></*tr>
</tbody>
</table>

If you need to do this with individual rows, you can use a naming
convention of some sort, or selectively apply the
..getElementsByTagName() method.

Jul 23 '05 #3

Danny

On Thu, 30 Jun 2005 09:24:22 -0700, AR <ar********@yahoo.com> wrote:
Yes, as Martin said, use the rows[] collection for the table element:

document.getElementById('YOURTABLEIDHERE').rows[3].style.display='none';
//sets the
style.display for it to 'none';

Another way will be using associative IDs for the relevant elements and
iterate
through them.

Danny

--Using Opera's revolutionary e-mail client: http://www.opera.com/mail/

Jul 23 '05 #4

Similar topics

Dynamically Show/Hide table rows?

by: Harry | last post by:

I want to provide a drill down facility for the users - the plan is to intially display a table with summary rows containing results of previous selected search criteria. In each summary row you...

Javascript

Show/hide table rows -- parameter undefined error?

by: KathyB | last post by:

Hi, I'm trying to get the following script to work, but I'm getting an error saying "rowID is undefined". function showhide(rowId) { var showRow = "Edit_" + rowID var hideRow = "View_" + rowID...

Javascript

Show / Hide Table Rows

by: Mark | last post by:

Hi, I need to be able to have five different links and when when someone clicks to show row 2, row 1 automatically hides. Right now all i can figure out is a link that will show but then you...

Javascript

collapsible tables: how to hide table rows in that testcase (IE failsto render ok, Moz,Op fine)

by: Marek Mänd | last post by:

Please explain to a experienced fool like me, how to hide table rows correctly at this case. http://marekmand.kuubik.ee/iebug_canthide_table_rows_properly.htm Click on the header "label" and see...

Javascript

how to Hide TABLE rows by grouping them into DIV?

by: Wang, Jay | last post by:

I try to group several rows in a table into a div and show/hide them by click on a button somewhere with a javascript link. When clicked, the link will toggle the style of the div section's style...

Javascript

How to hide table rows and show them when user click a different row?

by: RA | last post by:

Hi I want to have a FAQ so that when the user clicks the question the answer will be shown below the questions. How do I do it? I use c# with asp.net. Thanks

ASP.NET

Show/Hide Table Rows

by: shankwheat | last post by:

I'm creating a dynamic table with asp and I would like to add a "Show All" and "Collapse All" feature to show/hide certain rows within the table. This code works well for showing/hiding one row at...

Javascript

Hide/Show Rows based on text box input

by: jimstruckster | last post by:

I have a table with 10 rows, I want all rows except for the first to be hidden when the page first opens up. If the user puts a value in a text box in the first row then I want the second row to...

Javascript

JavaScript - Show/Hide table rows with unchecked checkboxes

by: jbreaker | last post by:

Hi - I have a table with about 30 rows, which contain a checkbox and a bit of text each. What I'm trying to find a way to do is to have 2 buttons at the bottom of the page - HIDE & SHOW. When the...

Javascript

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Basic Javascript concepts

by: aa123db | last post by:

Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...

Javascript

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing