Hiding multiple rows in a dynamic table

[Rick Measham]

I have a set of data that I display in a table. Each row has a category
and there may be a dozen or more rows in the same category. I'm looking
to add filter buttons to the page to hide/show categories on the fly.

Currently I can: Set the id on the tr to (category name) or to (category
name.data id).

Using the first, is there a way to hide all rows with that same id? It
seems currently to only hide the first row with that id.

If not, is there an easy way to find all rows whose id starts with
(category name)? I figure I could regex over every element in the page
looking for ones that begin with a particular id, but that would be
silly.

Also, is there a way to refer to every row of a table? I'd like to first
hide every row, then show those in the required category.

--
Change the *eye* in my email to the letter 'i'.

[Martin Honnen]

Re: Hiding multiple rows in a dynamic table



Rick Measham wrote:
[color=blue]
> I have a set of data that I display in a table. Each row has a category
> and there may be a dozen or more rows in the same category. I'm looking
> to add filter buttons to the page to hide/show categories on the fly.
>
> Currently I can: Set the id on the tr to (category name) or to (category
> name.data id).
>
> Using the first, is there a way to hide all rows with that same id? It
> seems currently to only hide the first row with that id.
>
> If not, is there an easy way to find all rows whose id starts with
> (category name)? I figure I could regex over every element in the page
> looking for ones that begin with a particular id, but that would be
> silly.
>
> Also, is there a way to refer to every row of a table? I'd like to first
> hide every row, then show those in the required category.[/color]

If you have
<table id="tableId"
you can access the rows collection of the table element object:
var table;
if (document.all)
table = document.all['tableId'];
else if (document.getEl ementById)
table = document.getEle mentById('table Id');
if (table) {
//access table.rows
}
--

Martin Honnen

http://JavaScript.FAQTs.com/