Collapsible Menu <SPAN> [Show/Hide]

[Eulibrius7]

I'm working on a text-based sub-navigation menu using NOT Javascript but ASP.NET Controls, Event Handlers, and a Show/Hide subroutine. Broken down logically this is easy to achieve, however, since I don't know ASP->ASP.NET from the ground up I'm having passing arguments through the onServerClick <a/> tag. Please help in establishing structure and syntax for this code. Thanks. Pseudo-code as follows:

Sub Expand_Menu()

Call Collapse_Menus()
ElementID.Visible = "true"

End Sub

Sub Collapse_Menus()

X = Determine active/expanded menu
X.Visible = "false"

End Sub



<table>

<span id="heading0" runat="server">
<tr>
<th><a href="#" onServerClick="Expand_Menu" runat="server">Heading0</a></th>
</tr>
</span>

<span id="items0" runat="server" visible="false">
<tr>
<td>Item1</td>
</tr>
<tr>
<td>Item2/td>
</tr>
<tr>
<td>Item3</td>
</tr>
</span>

<span id="heading1" runat="server">
<tr>
<th><a href="#" onServerClick="Expand_Menu" runat="server">Heading1</a></th>
</tr>
</span>

<span id="items1" runat="server" visible="false">
<tr>
<td>Item1</td>
</tr>
<tr>
<td>Item2/td>
</tr>
<tr>
<td>Item3</td>
</tr>
</span>

<etc..../>

</table>

[PeOfEo]

To change the visible attribute for elements running at the server from false to true or true to false the page needs to be resent. <asp:label will output a span, but the problem is it does not have an autopostback attribute. You will need something with that attribute so when you use the proper 'event hanler' it will resend the page. So you can't have the user simply click a label and have it become visible or invisible. Because you would need a text box, drop down list, radio button, or some other form element or a command button to be able to use that auto post back. You can however use a link, image or hyperlink, with a querystring, and then have it send the use to the page he is on (you can get which page he is on by using request.servervariables("url")) and then add that query string for the menu selection, have the script running at page load do a request.querystring("id"), and from that determine which div or span needs to be visible. If you need more help I can write a bit of code. Problem is, right now I am not running a server because my motherboard is in california in the newegg rma office, and I do not feel like setting up iis on this box, so I can't test code I write without uploading it to a server, which is a pain.

[Eulibrius7]

<b>Objective:</b>
Simple collapsible sub-navigation menu.

<b>Method:</b>
VBASP.NET; Eventhandler subroutines (show/hide)

<b>Objects:</b>
Nested ASP Panel Server Control

<b>Logic (Pseudo):</b>

<b>Subroutines:</b>

<code>
Show_SubItems()
Call Hide_Active()

Find appropriate SubItems Panel to show
SubItems(x).Visible = True
End Sub

Hide_Active()
Check which SubItems Panel = Active
ActiveSubItems.Visible = False
End Sub

</code>

<b>Layout:</b>

<code>
<Panel ID="Heading1">
<A HREF="" onServerClick="Show_SubItems">Heading Text1</A>
<Panel ID="SubItems1">
SubItem 1
SubItem 2
Subitem 3
</Panel>
</Panel>

<Panel ID="Heading2">
<A HREF="" onServerClick="Show_SubItems">Heading Text2</A>
<Panel ID="SubItems2">
SubItem 1
SubItem 2
Subitem 3
</Panel>
</Panel>
</code>

<b>Help:</b>

1. How can I programmatically detect the HEADING that is the parent of the Anchor Element OnServerClick Function & intelligently correspond with showing its nested Panel. It could work using lots of If and Then logic and hard coded detectors but there HAS to be an <b>intelligent</b> to do this automatically.
2. Is there an easier way by building a custom control? (I just don't like excess baggage)

[PeOfEo]

I told you how to do it... The easiest way would be detecting what is open and closed with a query string as I said in my last post.