473,503 Members | 4,234 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Show or Hide Elements

BRawn
28 New Member
I'm new to ASP.NET and I've been trying write code to show and hide certain elements on link's onclick event, but no matter what I try, nothing's working. Here's my scenario...

I have a MasterPageFile with 3 ContentPlaceHolders. One for navigation (links which call the web forms which populate the main content placeholder), one for sub-categories (should there be) and one for the main content (which gets populated with web forms).

If I have a link which contains sub-categories, the sub-categories ContentPlaceHolder should populate with the links for each sub-category respectively. The idea is to use the sub-category links to jump to a specific place on the page.

The problem I'm having is that I can't seem to show or hide the sub-categories ContentPlaceHolder, no matter what I try. Here's what I've tried:

JavaScript...

Expand|Select|Wrap|Line Numbers
  1.  
  2. <script type="text/javascript">
  3.  
  4.     function hideControl(controlID)
  5.     {
  6.         document.getElementById(controlID).style.visibility = 'hidden';
  7.     }
  8.  
  9.     function showControl(controlID)
  10.     {
  11.         document.getElementById(controlID).style.visibility = 'visible';
  12.     }
  13.  
  14. </script>
  15.  
  16.  


Expand|Select|Wrap|Line Numbers
  1.  
  2. <script type="text/javascript">
  3.  
  4.     function hideControl(controlID)
  5.     {
  6.  
  7.         document.getElementById(controlID).style.display = 'block';
  8.     }
  9.  
  10.     function showControl(controlID)
  11.     {
  12.  
  13.         document.getElementById(controlID).style.display = 'none';
  14.     }
  15.  
  16. </script>
  17.  
  18.  



I tried using it like this (in my individual web forms):




Expand|Select|Wrap|Line Numbers
  1.  
  2. <%@ Page Language="C#" MasterPageFile="~/MasterPageFile.master" Title="Page Title" %>
  3. <asp:Content ID="Content1" ContentPlaceHolderID="mainContent" Runat="Server">
  4.  
  5. <div class="bodyBackgroundLeft_ContentDIV"><a class="subMenuItems" href="#" style="text-decoration: none; padding-right: 92px; overflow: visible" onclick="showControl(Content3)">Link 1</a></div>
  6. <div class="ClassLink"><a class="subMenuItems" href="#" style="text-decoration: none" onclick="hideControl(Content3)">Link 2</a></div>
  7.  
  8.  


I've also tried using the code-behind file, like this:




Expand|Select|Wrap|Line Numbers
  1.  
  2.     void hideContentPlaceHolders()
  3.     {
  4.         ContentPlaceHolder cph = (ContentPlaceHolder)this.Page.Master.FindControl("subContent");
  5.         cph.Visible = false;
  6.     }
  7.  
  8.     void showContentPlaceHolders()
  9.     {
  10.         ContentPlaceHolder cph = (ContentPlaceHolder)this.Page.Master.FindControl("subContent");
  11.         cph.Visible = true;
  12.     }
  13.  
  14.  


...and calling it like this:




Expand|Select|Wrap|Line Numbers
  1.  
  2. <%@ Page Language="C#" MasterPageFile="~/MasterPageFile.master" Title="Page Title" %>
  3. <asp:Content ID="Content1" ContentPlaceHolderID="mainContent" Runat="Server">
  4.  
  5. <div class="bodyBackgroundLeft_ContentDIV"><a class="subMenuItems" href="#" style="text-decoration: none; padding-right: 92px; overflow: visible" onclick="showContentPlaceHolders()">Link 1</a></div>
  6. <div class="ClassLink"><a class="subMenuItems" href="#" style="text-decoration: none" onclick="hideContentPlaceHolders()">Link 2</a></div>
  7.  
  8.  


The ContentPlaceHolder on my individual web forms look like this:



Expand|Select|Wrap|Line Numbers
  1.  
  2. <asp:Content ID="Content3" ContentPlaceHolderID="subContent" runat="server">
  3.     <div class="Link1"><a class="subMenuItems" href="#" style="text-decoration: none; overflow: visible">JumpToSection</a></div>
  4.     <div class="Link2"><a class="subMenuItems" href="#" style="text-decoration: none; overflow: visible">JumpToSection</a></div>
  5.     <div class="Link3"><a class="subMenuItems" href="#" style="text-decoration: none; overflow: visible">JumpToSection</a></div>
  6. </asp:Content>
  7.  
  8.  


And on my MasterPageFile...




Expand|Select|Wrap|Line Numbers
  1.  
  2. <div style="width: 185px; position: absolute; z-index: 5; margin-left: 0px; margin-top: 280px;">
  3.             <div class="bodyMenuTop"></div>
  4.             <div style="background-color: White; width: 185px; height: 220px;">
  5.  
  6.                 <asp:ContentPlaceHolder ID="subContent" runat="server">
  7.  
  8.                 </asp:ContentPlaceHolder>
  9.  
  10.             </div>
  11.             <div class="bodyMenuBottom"></div>
  12.         </div>
  13.  
  14.  


I usually get errors when loading pages using the JavaScript function, using the 'block' and 'none' display. The error message isn't really clear and it doesn't pin-point the location of the error. It usually says I'm missing a '{', but I can't see that I am...

What am I doing wrong?
Any assistance would be appreciated...
Sep 2 '11 #1
1 5900
CroCrew
564 Recognized Expert Contributor
This is a asp.net question not a Classic ASP question.

CroCrew~
Nov 17 '11 #2

Sign in to post your reply or Sign up for a free account.

Similar topics

10
4625
by: oLE | last post by:
I would like to add some javascript to show/hide a certain row of a table. The first row of the table contain the hyperlink that calls the javascript the second row is the one i want to show/hide...
3
2929
by: alex | last post by:
I'd like to have a show/hide widget on my web site, kind of like "show details" / "hide details" in Google Groups. Is there a tutorial explaining how to make them? Google's is a bit complex and...
4
7980
by: jerryyang_la1 | last post by:
I've found this script that allows be to hide/show form elements.. <script language="JavaScript"><!-- var toggle = true; function show(object) { if (document.layers && document.layers)...
4
8706
by: itunes66 | last post by:
how can i do this i already have a function to show/hide elements with one link but how can i show/hide multiple elements here is the script function obj_ref(object) { if...
3
7712
by: | last post by:
I'm using the DataList and GridView controls, and I am trying to wrap my head around the problem of conditionally showing or hiding cells/cell content based on the presence or absence of DB data. I...
1
16723
by: asilverpeach | last post by:
Hey Guys! Found some great scripts here on this topic but have to make to changes to the code that I can't seem to figure out. First, In the following code clicking on the headers shows the...
1
4150
by: pamate | last post by:
hi, I want to show hide layers. I am able to show and hide layers but i am facing problem that, cant view the cursor in Mozilla,but i can type in input text box, its overlapping the layers. ...
1
1979
by: nubianqnn | last post by:
Hello All, I am stumped on a function to show/hide drop down elements based on a user's selection. If a user selects a second item from the first dropdown list, then I want to show a related...
4
6737
by: nubianqnn | last post by:
I am stumped on a function to show/hide drop down elements based on a user's selection. If a user selects a second item from the first dropdown list, then I want to show a related dropdown with two...
4
2628
by: metaphysics | last post by:
I searched forever to find this, but I didn't have any luck. Here's what I want to do: I want to have an image that when you click on it, it shows/hides content. I also want that image to change...
0
7067
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
1
6975
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
5562
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
1
4992
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
4666
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
0
3160
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The...
0
3148
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
0
1495
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...
0
371
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...

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.