472,373 Members | 1,885 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,373 software developers and data experts.

Showing/Hiding <tr> s

Hi All -

I have some problems getting a small piece of javascript working
correctly for Firefox. Here is what I am trying to do -

1. I have a form (like a search form)
2. I have many groups of searchable fields in the fields
3. Each group can be expanded/collapsed by clicking on a link
"(Fewer|More) Options" which sits right next to the group title.

For eg. -
I can search a person on "Name" - this group, "Name" has one field,
"First Name" in the collapsed state and more searchable fields ("Last
Name", "Middle Name") in the expanded state.

To achieve this, what I did was -

1. All the fields in one table
2. One row for each Label/Text-Box pair
3. Two columns on each row, the left one for Label and the right one
for Text-Box

For collapsing/expanding purposes, I had assigned an ID to each <tr>
that can be hidden/shown. And I had used the following js functions for
doing the same -

function toggleFields() {
var i = 0;
var src = document.getElementById(arguments[0]);
if (src.state == null || src.state == 'more') {
src.state = 'few';
src.innerHTML = 'Fewer Options';
else {
src.state = 'more';
src.innerHTML = 'More Options';
for (i = 1; i < arguments.length; i++) {
var obj = document.getElementById(arguments[i]);
if (obj.showing == null || obj.showing == 1) {
obj.showing = 0;
else {
obj.showing = 1;
displayObject(arguments[i], obj.showing);
function displayObject(id, show) {
var obj = document.getElementById(id);
if (obj==null) return;
obj.style.display = show ? 'block' : 'none';
obj.style.visibility = show ? 'visible' : 'hidden';
The HTML is something like this -
<tr id="fname"> <td> ... </td> <td> ... </td> </tr>
<tr id="lname"> <td> ... </td> <td> ... </td> </tr>
<tr id="mname"> <td> ... </td> <td> ... </td> </tr>

And the link to expand/collapse this group is like this -
<a id="nameToggle" href="toggleFields('nameToggle', 'lname', 'mname')">
Fewer Options </a>

The problem that I am facing -
1. It works well in IE-6.0
2. Goofs up the UI in Firefox-1.0.4 -
Works well the first time, (i.e., hiding lname and mname), but when
to expand the group again, the arrangement of rows/columns goes

Is there something that I am doing wrong?

- Anand

Aug 23 '05 #1
2 2109
c.**********@gmail.com wrote:
obj.style.display = show ? 'block' : 'none'; 2. Goofs up the UI in Firefox-1.0.4 -

In CSS 2 browsers, <tr> elements have a default display of table-row, not
block. Toggle between "none" and "" instead.

David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is
Aug 23 '05 #2

David Dorward wrote:

In CSS 2 browsers, <tr> elements have a default display of table-row, not
block. Toggle between "none" and "" instead.

Great! It works well now.
Thanks for your help
- Anand

Aug 23 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

by: John Geddes | last post by:
In both IE6 and Netscape 7: insertRow method of tbody is behaving as expected: - inserts a new row - increases tbody.rows.length BUT deleteRow is not doing the opposite. It DOES delete the...
by: F. Da Costa | last post by:
Hi, I' looking to retrieve ProdName1 form the <tr> below. <tr id="1-1-1" class="even"> <td> <div class="tier4"> <a href="#" class="leaf"></a> ProdName1 </div>
by: El Diablo | last post by:
Hi there, I'm trying dynamically generate extra rows in a table. So far this achieves this task within the tHead segment: theTable.tHead.appendChild(document.createElement('TR')) ....but...
by: Dominic | last post by:
I'm looking for a HTML editor that can match the opening and closing HTML tags such as <TR> </TR>, <TD> </TD> I think Dreamweaver does that, right? Even if it does, it may be too expensive for...
by: prefersgolfing | last post by:
I'm not using Master Pages, yet I'd like to display the contents of an HTML page within a <table><tr><td> on a .aspx. I have a lengthy guide already paginated in html. I'd like to embed the...
by: petereffect | last post by:
i have foll. code <tr> <a href="a1.shtml"> <td width='100%'> &nbsp;"+Testing+ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </td> </a>
by: mahesr | last post by:
I want to match some particular text between <tr>and </tr> or <td>and </td>.... in PHP. like below............ <table><tr> CATEGORY: <td><font face="Verdana" size="1" color="#A000A0"> Wedding...
by: jack | last post by:
Hi all im Creating a report in HTML with the help of dotnet.. im creating a which shows a data of 12 months .. the forst row of the column contains month names.. and the following data.. The...
by: Xiaoyan | last post by:
Hi,everyone: I have a problem now. I can't get the information between the <tr><td> and </td></tr>. for example: I use this regular expression can't get it, I don't know why....
by: Kemmylinns12 | last post by:
Blockchain technology has emerged as a transformative force in the business world, offering unprecedented opportunities for innovation and efficiency. While initially associated with cryptocurrencies...
by: WisdomUfot | last post by:
It's an interesting question you've got about how Gmail hides the HTTP referrer when a link in an email is clicked. While I don't have the specific technical details, Gmail likely implements measures...
by: Oralloy | last post by:
Hello Folks, I am trying to hook up a CPU which I designed using SystemC to I/O pins on an FPGA. My problem (spelled failure) is with the synthesis of my design into a bitstream, not the C++...
by: Carina712 | last post by:
Setting background colors for Excel documents can help to improve the visual appeal of the document and make it easier to read and understand. Background colors can be used to highlight important...
by: BLUEPANDA | last post by:
At BluePanda Dev, we're passionate about building high-quality software and sharing our knowledge with the community. That's why we've created a SaaS starter kit that's not only easy to use but also...
by: Rahul1995seven | last post by:
Introduction: In the realm of programming languages, Python has emerged as a powerhouse. With its simplicity, versatility, and robustness, Python has gained popularity among beginners and experts...
by: Ricardo de Mila | last post by:
Dear people, good afternoon... I have a form in msAccess with lots of controls and a specific routine must be triggered if the mouse_down event happens in any control. Than I need to discover what...
by: Johno34 | last post by:
I have this click event on my form. It speaks to a Datasheet Subform Private Sub Command260_Click() Dim r As DAO.Recordset Set r = Form_frmABCD.Form.RecordsetClone r.MoveFirst Do If...
by: ezappsrUS | last post by:
Hi, I wonder if someone knows where I am going wrong below. I have a continuous form and two labels where only one would be visible depending on the checkbox being checked or not. Below is the...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.