Need Assistance with Collapsible Content (C#)

Question

5.00/5 (1 vote)

See more: (untagged)

Hello,

I have a web page (in C#) that stores news and events. The data (news and events) is categorized by month. When the user visits the page, I would like to display the content of the existing month only. For example, the user will see.

August
event 1
news 2

July
June
May
April

I would like the user to be able to click on any other month to display the content of that respective month. Ideally, only one month should be expanded at a time (however this is not imperative).

Any help or assistance would be appreciated. If you need more information please let me know.

Thank you,

Allison

Posted 14-Aug-09 6:28am

ahayw01

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

Abhishek Sur · Answer 1 · 2009-08-14T09:40:00

why dont you use Javascript to display / hide content.

Say you have used the html code block as below :

<div onclick="javascript:expandCollapsePane(this, 'dvContainer');"><br />August<br /></div><br /><div id="dvContainer"><br />Event 1 <br />News 2<br /></div>

Now when user clicks on the Div Pane named august you can make the container div visible true or false :

function expandCollapsePane(obj, pane) {<br />   var containerPane = document.getElementByID(pane);<br />   var isCollapsed = (containerPane.style.display == 'none');<br />   if (isCollapsed) {<br />      containerPane.style.display = 'block';<br />   }<br />   else {<br />      containerPane.style.display = 'none';<br />   }<br />}

The javascript just hides the dvContainer on click. To make all of them invisible when one is open, just create an array of all such elements you create and before expanding anyone of them do a for loop and hide each other element in the block.

Hope you understand. [thumbs up][Rose]