Hide using a div tab

Mardy

I have an aspx page that contains a drop down and 3 divs and lots of other
stuff. I'd like to hide the divs depending on which option from the drop down
is selected. It works fine until I do a postback then all 3 divs are visible.

When the page initially loads I see just the div corresponding to the
default value in the ddl. Prior to a postback the display works as intended
but once a postback occurs all 3 divs are visible until I make another
selection on the ddl.

Code is below. As you will see I try to stay away from javascript but would
really like to avoid a postback here.

Thanks

Code behind
Protected WithEvents bodytag As HtmlGenericCont rol
PageLoad
ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
bodytag.Attribu tes.Add("onload ", "return toggleDiv()")
aspx page
<script language="JavaS cript"> function toggleDiv() {
div1 = document.getEle mentById('divAs sessment');
div2 = document.getEle mentById('divNC ');
div3 = document.getEle mentById('divDe signComments');
DDL = document.getEle mentById('ddlSe arch');
if (DDL.selectedIn dex == 0) {
div1.style.visi bility = 'visible';
div1.style.disp lay = 'block';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 1) {
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'visible';
div2.style.disp lay = 'block';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 2)
{
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'visible';
div3.style.disp lay = 'block';
}
}

</script>

<body runat="server" id="bodytag">

<div >...

Nov 19 '05 #1

Subscribe Reply

2838

Sreejith Ram

What you need here is a call to the javascript function toggleDiv, after the
page is loaded in broswer

try
Page.RegisterSt artupScript("<s cript>toggleDiv ();</script>");

"Mardy" wrote:

I have an aspx page that contains a drop down and 3 divs and lots of other
stuff. I'd like to hide the divs depending on which option from the drop down
is selected. It works fine until I do a postback then all 3 divs are visible.

When the page initially loads I see just the div corresponding to the
default value in the ddl. Prior to a postback the display works as intended
but once a postback occurs all 3 divs are visible until I make another
selection on the ddl.

Code is below. As you will see I try to stay away from javascript but would
really like to avoid a postback here.

Thanks

Code behind
Protected WithEvents bodytag As HtmlGenericCont rol
PageLoad
ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
bodytag.Attribu tes.Add("onload ", "return toggleDiv()")
aspx page
<script language="JavaS cript"> function toggleDiv() {
div1 = document.getEle mentById('divAs sessment');
div2 = document.getEle mentById('divNC ');
div3 = document.getEle mentById('divDe signComments');
DDL = document.getEle mentById('ddlSe arch');
if (DDL.selectedIn dex == 0) {
div1.style.visi bility = 'visible';
div1.style.disp lay = 'block';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 1) {
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'visible';
div2.style.disp lay = 'block';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 2)
{
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'visible';
div3.style.disp lay = 'block';
}
}

</script>

<body runat="server" id="bodytag">

<div >...

Nov 19 '05 #2

Mardy

Awsome, that does it.

Thanks... but why does the initial page load work but not the postback?

"Sreejith Ram" wrote:

What you need here is a call to the javascript function toggleDiv, after the
page is loaded in broswer

try
Page.RegisterSt artupScript("<s cript>toggleDiv ();</script>");

"Mardy" wrote:
I have an aspx page that contains a drop down and 3 divs and lots of other
stuff. I'd like to hide the divs depending on which option from the drop down
is selected. It works fine until I do a postback then all 3 divs are visible.

When the page initially loads I see just the div corresponding to the
default value in the ddl. Prior to a postback the display works as intended
but once a postback occurs all 3 divs are visible until I make another
selection on the ddl.

Code is below. As you will see I try to stay away from javascript but would
really like to avoid a postback here.

Thanks

Code behind
Protected WithEvents bodytag As HtmlGenericCont rol
PageLoad
ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
bodytag.Attribu tes.Add("onload ", "return toggleDiv()")
aspx page
<script language="JavaS cript"> function toggleDiv() {
div1 = document.getEle mentById('divAs sessment');
div2 = document.getEle mentById('divNC ');
div3 = document.getEle mentById('divDe signComments');
DDL = document.getEle mentById('ddlSe arch');
if (DDL.selectedIn dex == 0) {
div1.style.visi bility = 'visible';
div1.style.disp lay = 'block';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 1) {
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'visible';
div2.style.disp lay = 'block';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 2)
{
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'visible';
div3.style.disp lay = 'block';
}
}

</script>

<body runat="server" id="bodytag">

<div >...

Nov 19 '05 #3

Sreejith Ram

I can only make a guess without seeing code

is there code hiding/showing divs at server side ? if so is it in "if
(!Page.IsPostBa ck)" ?
"Mardy" wrote:

Awsome, that does it.

Thanks... but why does the initial page load work but not the postback?

"Sreejith Ram" wrote:
What you need here is a call to the javascript function toggleDiv, after the
page is loaded in broswer

try
Page.RegisterSt artupScript("<s cript>toggleDiv ();</script>");

"Mardy" wrote:
I have an aspx page that contains a drop down and 3 divs and lots of other
stuff. I'd like to hide the divs depending on which option from the drop down
is selected. It works fine until I do a postback then all 3 divs are visible.

When the page initially loads I see just the div corresponding to the
default value in the ddl. Prior to a postback the display works as intended
but once a postback occurs all 3 divs are visible until I make another
selection on the ddl.

Code is below. As you will see I try to stay away from javascript but would
really like to avoid a postback here.

Thanks

Code behind
Protected WithEvents bodytag As HtmlGenericCont rol
PageLoad
ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
bodytag.Attribu tes.Add("onload ", "return toggleDiv()")
aspx page
<script language="JavaS cript"> function toggleDiv() {
div1 = document.getEle mentById('divAs sessment');
div2 = document.getEle mentById('divNC ');
div3 = document.getEle mentById('divDe signComments');
DDL = document.getEle mentById('ddlSe arch');
if (DDL.selectedIn dex == 0) {
div1.style.visi bility = 'visible';
div1.style.disp lay = 'block';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 1) {
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'visible';
div2.style.disp lay = 'block';
div3.style.visi bility = 'hidden';
div3.style.disp lay = 'none';
}

if (DDL.selectedIn dex == 2)
{
div1.style.visi bility = 'hidden';
div1.style.disp lay = 'none';
div2.style.visi bility = 'hidden';
div2.style.disp lay = 'none';
div3.style.visi bility = 'visible';
div3.style.disp lay = 'block';
}
}

</script>

<body runat="server" id="bodytag">

<div >...

Nov 19 '05 #4

Mardy

yes
ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
bodytag.Attribu tes.Add("onload ", "return toggleDiv()")

i have these two lines in between that if stmt but I tried both in and
outside that if stmt and saw no difference.

Thanks
"Sreejith Ram" wrote:

I can only make a guess without seeing code

is there code hiding/showing divs at server side ? if so is it in "if
(!Page.IsPostBa ck)" ?
"Mardy" wrote:
Awsome, that does it.

Thanks... but why does the initial page load work but not the postback?

"Sreejith Ram" wrote:
What you need here is a call to the javascript function toggleDiv, after the
page is loaded in broswer

try
Page.RegisterSt artupScript("<s cript>toggleDiv ();</script>");

"Mardy" wrote:

> I have an aspx page that contains a drop down and 3 divs and lots of other
> stuff. I'd like to hide the divs depending on which option from the drop down
> is selected. It works fine until I do a postback then all 3 divs are visible.
>
> When the page initially loads I see just the div corresponding to the
> default value in the ddl. Prior to a postback the display works as intended
> but once a postback occurs all 3 divs are visible until I make another
> selection on the ddl.
>
> Code is below. As you will see I try to stay away from javascript but would
> really like to avoid a postback here.
>
> Thanks
>
> Code behind
> Protected WithEvents bodytag As HtmlGenericCont rol
> PageLoad
> ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
> bodytag.Attribu tes.Add("onload ", "return toggleDiv()")
>
>
> aspx page
> <script language="JavaS cript"> function toggleDiv() {
> div1 = document.getEle mentById('divAs sessment');
> div2 = document.getEle mentById('divNC ');
> div3 = document.getEle mentById('divDe signComments');
> DDL = document.getEle mentById('ddlSe arch');
> if (DDL.selectedIn dex == 0) {
> div1.style.visi bility = 'visible';
> div1.style.disp lay = 'block';
> div2.style.visi bility = 'hidden';
> div2.style.disp lay = 'none';
> div3.style.visi bility = 'hidden';
> div3.style.disp lay = 'none';
> }
>
> if (DDL.selectedIn dex == 1) {
> div1.style.visi bility = 'hidden';
> div1.style.disp lay = 'none';
> div2.style.visi bility = 'visible';
> div2.style.disp lay = 'block';
> div3.style.visi bility = 'hidden';
> div3.style.disp lay = 'none';
> }
>
> if (DDL.selectedIn dex == 2)
> {
> div1.style.visi bility = 'hidden';
> div1.style.disp lay = 'none';
> div2.style.visi bility = 'hidden';
> div2.style.disp lay = 'none';
> div3.style.visi bility = 'visible';
> div3.style.disp lay = 'block';
> }
> }
>
> </script>
>
> <body runat="server" id="bodytag">
>
> <div >...
>

Nov 19 '05 #5

Sreejith Ram

Well,my guess was that your onload=toggledi v() is not working the first time
or in postbacks.. I meant you may have some other server side code to hide
div, like below ..

if(!Page.PostBa ck)
{
if(somevalue="0 ")
{
div1.attributes .add("style","v isibility:none" ) ;
div1.attributes .add("style","v isibility:hidde n") ;

}
}

Any case the bottmline is, if one need to access the HTML elements using
javascript when the page loads, use Page.RegisterSt artupScript ... :)

"Mardy" wrote:

yes
ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
bodytag.Attribu tes.Add("onload ", "return toggleDiv()")

i have these two lines in between that if stmt but I tried both in and
outside that if stmt and saw no difference.

Thanks
"Sreejith Ram" wrote:
I can only make a guess without seeing code

is there code hiding/showing divs at server side ? if so is it in "if
(!Page.IsPostBa ck)" ?
"Mardy" wrote:
Awsome, that does it.

Thanks... but why does the initial page load work but not the postback?

"Sreejith Ram" wrote:

> What you need here is a call to the javascript function toggleDiv, after the
> page is loaded in broswer
>
> try
> Page.RegisterSt artupScript("<s cript>toggleDiv ();</script>");
>
>
>
> "Mardy" wrote:
>
> > I have an aspx page that contains a drop down and 3 divs and lots of other
> > stuff. I'd like to hide the divs depending on which option from the drop down
> > is selected. It works fine until I do a postback then all 3 divs are visible.
> >
> > When the page initially loads I see just the div corresponding to the
> > default value in the ddl. Prior to a postback the display works as intended
> > but once a postback occurs all 3 divs are visible until I make another
> > selection on the ddl.
> >
> > Code is below. As you will see I try to stay away from javascript but would
> > really like to avoid a postback here.
> >
> > Thanks
> >
> > Code behind
> > Protected WithEvents bodytag As HtmlGenericCont rol
> > PageLoad
> > ddlSearch.Attri butes.Add("onch ange", "return toggleDiv()")
> > bodytag.Attribu tes.Add("onload ", "return toggleDiv()")
> >
> >
> > aspx page
> > <script language="JavaS cript"> function toggleDiv() {
> > div1 = document.getEle mentById('divAs sessment');
> > div2 = document.getEle mentById('divNC ');
> > div3 = document.getEle mentById('divDe signComments');
> > DDL = document.getEle mentById('ddlSe arch');
> > if (DDL.selectedIn dex == 0) {
> > div1.style.visi bility = 'visible';
> > div1.style.disp lay = 'block';
> > div2.style.visi bility = 'hidden';
> > div2.style.disp lay = 'none';
> > div3.style.visi bility = 'hidden';
> > div3.style.disp lay = 'none';
> > }
> >
> > if (DDL.selectedIn dex == 1) {
> > div1.style.visi bility = 'hidden';
> > div1.style.disp lay = 'none';
> > div2.style.visi bility = 'visible';
> > div2.style.disp lay = 'block';
> > div3.style.visi bility = 'hidden';
> > div3.style.disp lay = 'none';
> > }
> >
> > if (DDL.selectedIn dex == 2)
> > {
> > div1.style.visi bility = 'hidden';
> > div1.style.disp lay = 'none';
> > div2.style.visi bility = 'hidden';
> > div2.style.disp lay = 'none';
> > div3.style.visi bility = 'visible';
> > div3.style.disp lay = 'block';
> > }
> > }
> >
> > </script>
> >
> > <body runat="server" id="bodytag">
> >
> > <div >...
> >

Nov 19 '05 #6

Similar topics

4722

Deprecated hide and show for Choice

by: Doug van Vianen | last post by:

Hi, I am using Choice to provide a dropdown menu in an Applet. I create the Choice and then need to hide it until it is needed and then show it. I use c.hide() and c.show() where 'c' is the choice. This works fine except that when I use javac to compile the code I get the message that I am using a deprecated API. That is, hide() and show() for choices (and presumably other items) is no longer used. I have tried doing a search to find...

Java

4514

Show/Hide multiple TabControls at runtime

by: Steve | last post by:

Visual Studio 2003 C# Windows: I have a tree view control as my main menu control down the left side of my application. This has 2 Parent Nodes on it (Jobs and Employees). beneath these 2 main functions I have 2 sub functions under each("Add Job", "View Jobs" and "Add User", "View Users"). I have theses subfunctions grouped in a TabControl, so there are 2 TabControl objects on my main screen, each with 2 pages on. When the user...

.NET Framework

2956

show/hide thingy

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 it's easy to get something wrong. If the browser does not support the required features, I want it to generate a completely static page with the "details" shown automatically.

Javascript

2220

control won't "hide"

by: | last post by:

I have a page where I have 3 combo boxes listed in a column. sort of like: combo1 combo2 combo3 Based on which one is clicked, the others are supposed to hide (i.e. combobox.visible = false). However, when I have the bottom one in that column to be the one to be used

ASP.NET

29156

Show/Hide text field

by: FP | last post by:

I'm new to Java Script. I'm displaying comments people have made. Below each persons' comment I want to add 2 buttons "Reply" and "Amend". Clicking "Reply" would display an empty text field below the comment with a spell check & submit button. Clicking "Amend" would display the same buttons & text field but pre-populated with the original comment. Using Java Script how do I show / hide the text field in my list of comments but have...

Javascript

2798

hide/unhide data with variable numbers of fields

by: toodi4 | last post by:

I'm using a javascript that hides and unhides text based on a button click. It works great across static fields on a form. The problem I have is that I'm trying to hide and unhide various fields that are populated on the page by a database. In other words, sometimes there are 4 fields, sometimes 6. I've used various scripts for the hide/unhide function. This is one I'm using now that I've copied from another source: <script...

Javascript

7578

Show/hide rows of a table

by: Liquidtouch | last post by:

I have been searching on this for awhile and cant find anything and playing around with it got me no where. I will start with what I am after and then explain what I have. I have a table with 3 rows and 2 columns. I would like on page load to only have one row visible with the bottom two rows hidden. I would like to have an "add" button on the bottom most visible row. When you click the "add" button it adds a row to the bottom and moves the...

Javascript

3219

Trying to hide an img control upon command

by: Doogie | last post by:

Hi I have an img control I am trying to hide upon certain types of commands in my code behind. When to hide it is directly tied to a asp:dropdownlist control. So depending on what the user selects in that dropdownlist, this image will be hidden or be displayed. I have tied the onselectedindexchanged value of the dropdownlist to a c-sharp method (not javascript) because other things are being done as well that I want to do server side. ...

ASP.NET

2544

how to not hide a division

by: richard | last post by:

In using the simple code below, how do I tell it NOT to hide a division when the link is clicked on if that division is already visible? would it be as simple as using a 2nd function and setting that to "display" rather than "none"? For instance, "home" is showing. The user clicks on "home". I don't want the division to do anything at all.

Javascript

10789

Play with image A Technique in Java - Search image, Convert image to text , Hide data

by: Debadatta Mishra | last post by:

Introduction In this article I will provide you an approach to manipulate an image file. This article gives you an insight into some tricks in java so that you can conceal sensitive information inside an image, hide your complete image as text ,search for a particular image inside a directory, minimize the size of the image. However this is not a new concept, there is a concept called Steganography which enables to conceal your secret...

Java

9700

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

9564

Changing the language in Windows 10

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 effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

10546

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

10310

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

9121

AI Job Threat for Devs

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, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

7603

Access Europe - Using VBA to create a class based on a table - Wed 1 May

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 presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

4275

transfer the data from one system to another through ip address

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 we have to send another system

C# / C Sharp

3796

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP

2970

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

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 can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General