Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Hide/display information in nested table

Status
Not open for further replies.
breeb

breeb

Programmer
Jul 8, 2003
25
ZA
I would like to show certain information and also provide the user with the option to view other information. At the moment, the view/hide function works, but not in the correct way as it displays the information and clicking on 'view' hides it. Also this only works for the first row in the main table.

<SCRIPT>
function toggle(e)
{
if (e.style.display == &quot;none&quot;)
{
e.style.display = &quot;&quot;;
}
else
{
e.style.display = &quot;none&quot;;
}

}
</SCRIPT>

<tr>

<td width=&quot;100%&quot; height=&quot;61&quot; align=&quot;left&quot; valign=&quot;top&quot;> <b>Systems:</b>

<%
tSQL =&quot;SELECT Systems.System, Prod_Areas.[Production Area], Systems.Description FROM Prod_Areas INNER JOIN Systems ON Prod_Areas.PArea = Systems.PArea WHERE (Prod_Areas.[Production Area] = '&quot;&(parea)&&quot;')&quot;
RS1.Open tSQL, DB%>

<table border=&quot;1&quot; width=&quot;100%&quot; height=&quot;1&quot;>

<div style = &quot;cursor: hand&quot; onClick = &quot;toggle(document.getElementById('HideShow'));&quot;>
View
</div>

<span style = &quot;color: blue&quot; id = HideShow>

<%If RS1.EOF and RS1.BOF Then
Response.Write &quot;There are no systems listed for this production area&quot;
Else%>

</span>

<%RS1.MoveFirst
While Not RS1.EOF%>
<tr>
<td width=&quot;50%&quot; height=&quot;1&quot;><%Response.Write RS1.Fields (&quot;System&quot;)%></td>
<td width=&quot;50%&quot; height=&quot;1<%Response.Write RS1.Fields (&quot;Description&quot;)%></td>
</tr>
<%RS1.MoveNext
Wend
End if%>
</table>
<%RS1.close%>
</tr>


Any ideas?
 
Sort by date Sort by votes
Hi Breeb,

I do it by keeping track of a variable (TableVisible).


var TableVisible = true;

function doShowHideDeal()
{
if( TableVisible )
{
tblDeal.style.display = &quot;none&quot;;
event.srcElement.src = &quot;images/expand.gif&quot;;
}
else
{
tblDeal.style.display = &quot;&quot;;
event.srcElement.src = &quot;images/collapse.gif&quot;;
}
TableVisible = !TableVisible;
}
 
Upvote 0 Downvote
Thank you, but it still doesn't work. I'm sending through document.getElementById('HideShow') when the function is called whereas you do not send any parameters through. What is 'tblDeal'?
 
Upvote 0 Downvote
tblDeal is the name of the table I'm hiding... I'll have a go at your code now.
 
Upvote 0 Downvote
Thank you! I am currently displaying the information and then using the function to diaplay/hide it. However, I would only like to display the information once 'view' is clicked on. Would this require the displaying of the information to be in a javascript function? Is this possible?

Thanks again for your efforts :)
 
Upvote 0 Downvote
Ok... the below code works for me... you hadn't closed a <td> properly and had missed one also.

I've rem the asp database rs stuff by using the symble ' inside the <%'%> tags like so and added the texts: flag1, flag2 and flag3.

I'd suggest you try running the code as it is now and then remove the flag tags and re-instate the asp database and rs stuff.

Any problems just shout

Mark

----------------

<BODY>
<SCRIPT>
function toggle(e)
{
if (e.style.display == &quot;none&quot;)
{
e.style.display = &quot;&quot;;
}
else
{
e.style.display = &quot;none&quot;;
}

}
</SCRIPT>
<table>
<tr>
<td width=&quot;100%&quot; height=&quot;61&quot; align=&quot;left&quot; valign=&quot;top&quot;> <b>Systems:</b>
<%'tSQL =&quot;SELECT Systems.System, Prod_Areas.[Production Area], Systems.Description FROM Prod_Areas INNER JOIN Systems ON Prod_Areas.PArea = Systems.PArea WHERE (Prod_Areas.[Production Area] = '&quot;&(parea)&&quot;')&quot;
'RS1.Open tSQL, DB%>
<table border=&quot;1&quot; width=&quot;100%&quot; height=&quot;1&quot;>
<div style = &quot;cursor: hand&quot; onClick = &quot;toggle(document.getElementById('HideShow'));&quot;>
View
</div>

<span style = &quot;color: blue&quot; id = HideShow>
<%'If RS1.EOF and RS1.BOF Then
'Response.Write &quot;There are no systems listed for this production area&quot;
'Else%>
Flag1
</span>

<%'RS1.MoveFirst
'While Not RS1.EOF%>
<tr>
<td width=&quot;50%&quot; height=&quot;1&quot;>Flag2<%'Response.Write RS1.Fields (&quot;System&quot;)%></td>
<td width=&quot;50%&quot; height=&quot;1&quot;>Flag3<%'Response.Write RS1.Fields (&quot;Description&quot;)%></td>
</tr>
<%'RS1.MoveNext
'Wend
'End if%>
</table>
<%'RS1.close%>
</td>
</tr>
</table>
</BODY>
 
Upvote 0 Downvote
Thanks for your help. It still doesn't work 100% though.

There are two problems:
1) Clicking on 'View' only works for the first row in the table so that clicking on 'view' in any other row in the table displays/hides the information in the first row!

2) I would like the information NOT to be displayed when the page is loaded and only be shown once the user wishes it to be (the opposite is happening at the moment).

Any ideas?

Bridgid
 
Upvote 0 Downvote
ok...

for the second problem change in the <span> line :

from this:
<span style = &quot;color: blue&quot; id = HideShow>

to this:
<span style = &quot;color: blue; display: none&quot; id = HideShow>

Can you expand on what you want in question1?

Mark
 
Upvote 0 Downvote
Thanks! That solved the second question!

Regarding the first question, I have a table listing different areas and then another table inside each row of the first table listing the systems for each area. When 'view' is clicked on in ANY row in the main table, this action is applied to the first row. Does that help much?

Bridgid
 
Upvote 0 Downvote
Right... I've changed it a fair bit now...
There's no spans or div tags in the code, I changed the database sql query and the fields that are show in the table so I could run it against my database. You'll have to change these back to your database.

You'll also have to change dbConn back to DB.

I also added the following line because I didn't have it (you may or may not already have it or something similar)

--> <%Set RS1 = Server.CreateObject(&quot;ADODB.Recordset&quot;)%>

Try this code and see if it does more what you want.

Mark

--------

<BODY>
<%Set RS1 = Server.CreateObject(&quot;ADODB.Recordset&quot;)%>
<SCRIPT>
function toggle(e)
{
if (e.style.display == &quot;none&quot;)
{
e.style.display = &quot;&quot;;
}
else
{
e.style.display = &quot;none&quot;;
}
}
</SCRIPT>
<table>
<tr>
<td width=&quot;100%&quot; height=&quot;61&quot; align=&quot;left&quot; valign=&quot;top&quot;> <b>Systems:</b>
<%tSQL =&quot;SELECT TOP 5 * FROM tbl_link;&quot;
RS1.Open tSQL, dbConn

If RS1.EOF and RS1.BOF Then%>
There are no systems listed for this production area
<%Else%>
<table border=&quot;1&quot; width=&quot;100%&quot; height=&quot;1&quot;>
<%RS1.MoveFirst
While Not RS1.EOF%>
<tr>
<td colspan=&quot;2&quot;>
<a href=&quot;#&quot; onClick = &quot;toggle(document.getElementById('view<%Response.write(RS1(&quot;id&quot;))%>'));&quot;>View</a>
</td>
</tr>
<tr id=&quot;view<%Response.write(RS1(&quot;id&quot;))%>&quot; style=&quot;color: blue; display: none&quot;>
<td width=&quot;50%&quot; height=&quot;1&quot;>
<%Response.Write RS1.Fields (&quot;title&quot;)%>
</td>
<td width=&quot;50%&quot; height=&quot;1&quot;>
<%Response.Write RS1.Fields (&quot;urlPath&quot;)%>
</td>
</tr>
<%RS1.MoveNext
Wend%>
</table>
<%End if%>
<%RS1.close%>
</td>
</tr>
</table>
</BODY>
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
824
lexer
lexer
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
837
malpa
malpa
coldbohemia
  • Locked
  • Question
jquery function always returns contents of the same table cell, no matter which table cell i click
Replies
0
Views
750
coldbohemia
coldbohemia
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
944
xwb
xwb
bs6600
  • Locked
  • Question
Nested accordion problem
Replies
1
Views
274
bs6600
bs6600

Part and Inventory Search

Sponsor

Back
Top