473,903 Members | 3,525 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

show hide divs - show last state upon reload/post

ll
I'm currently working on a form which consists of a show and hide
javascript. The toggle works fine, although when I click on submit, I
would like the page to reload with the toggle (show/hide) div in the
same state it was before being submitted. E.G. If the div was
visible, I'd like for it to be visible upon return.
Here's the script I'm currently using - thanks for any help,
Louis

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

<script language="javas cript" type="text/javascript">
function WM_toggle(id){
if (document.all){
if(document.all[id].style.display == 'none'){
document.all[id].style.display = '';
} else {
document.all[id].style.display = 'none';
}
return false;
} else if (document.getEl ementById){
if(document.get ElementById(id) .style.display == 'none'){
document.getEle mentById(id).st yle.display = 'block';
} else {
document.getEle mentById(id).st yle.display = 'none';
}
return false;
}
}
</script>
Jun 27 '08 #1
1 4317
ll schreef:
I'm currently working on a form which consists of a show and hide
javascript. The toggle works fine, although when I click on submit, I
would like the page to reload with the toggle (show/hide) div in the
same state it was before being submitted. E.G. If the div was
visible, I'd like for it to be visible upon return.
Here's the script I'm currently using - thanks for any help,
Louis

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

<script language="javas cript" type="text/javascript">
function WM_toggle(id){
if (document.all){
if(document.all[id].style.display == 'none'){
document.all[id].style.display = '';
} else {
document.all[id].style.display = 'none';
}
return false;
} else if (document.getEl ementById){
if(document.get ElementById(id) .style.display == 'none'){
document.getEle mentById(id).st yle.display = 'block';
} else {
document.getEle mentById(id).st yle.display = 'none';
}
return false;
}
}
</script>
Hi,

First, that code is not recommended (at least not by me).
Why don't you simply use getElementById( )??
Also, stop using the language="javas cript".

Your function could look like:

<script type="text/javascript">
function showHide(someID ){
var theEldisp = document.getEle mentById(someID );
theEldisp.style .display=(theEl disp.style.disp lay=='none')?'b lock':'none';
}
</script>

<span onClick="showHi de('test');">cl ick here to toggle On and off</span>
<hr>
<div id="test" style='display: block'>
your hiding div content.<br your hiding div content.<br>
</div>
----------------
To your question concerning remembering the last state:
Since you have a fresh page, the old values are gone.
So you have to find some way to remember them.

Two ways to do this:
1) Clientside solution:
-store the values in a frameset.
When you post a form in a window in a frameset, only that window is
refreshed, not the window holding the frameset definition.
So you can store here the last value of the div.
Then, if the page loads, check let your new page ask the frameset for
the last value and act accordingly ('none' or 'block')

2) Post the state to your processing script, and let the response write
the right value.
If you control the server too, you can easily add a hidden field to your
form, set its value when somebody click the toggle.
Now if the form is received by the server, do you normal things, and
check for this hidden value, and in the output simply set it right
immediately.
So your output will be (on PHP for example):

<?php
$dispStyle = ((isset($_POST['lastdisp'])) ? $_POST['lastdisp']: 'none');
?>
<div id="test" style='display: <?php echo dispStyle; ?>'>
your hiding div content.<br your hiding div content.<br>
</div>
Hope that helps.
Personally I prefer the second solution because that doesn't involve
extra frames.

Regards,
Erwin Moller
Jun 27 '08 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
8016
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) document.layers.visibility = 'visible'; else if (document.all) { document.all.style.visibility = 'visible';
5
3211
by: dje | last post by:
In the OnClick event on a radioButtonList, I run a javascript to show/hide the appropriate div along with a submit button, which displays as expected. The problem is the submit no longer works on the button. If I quit using the divs, and do a postback on the radiobutton selection, showing/hiding tables instead, the button is ok and continues to work. I've tried a variety of controls instead of the button in a variety of places but it...
1
16771
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 div information. I want a nested show hide element though. So when you click on "Do you have carpets to be cleaned?" Small Rooms & Medium Rooms appears (that I got working) But Then when you click on Small rooms or medium rooms i want the three lines...
5
8445
by: ali | last post by:
Hello every one i need you help regarding div hide and show. i am having a link like <a href="#" onClick="expandWin()">show/hide </a> <div id=showHide> </div> within div i have lots of form tags and div elements say n. The problem
15
3819
by: worked | last post by:
I have a script that hides / shows form elements, and wrapped in a tab script (tab navigation). When the code is duplicated (per tab content), the hide / show function works for the first tab but breaks in each subsequent tab. Why? Help appreciated! Example: http://geocities.com/edmurphy21/ hide / show script: <script type="text/javascript"> function showHide() { var idx = this.id.split('-'); var sp =...
2
2153
by: dusk | last post by:
Hi, I have a page with lots of hidden divs which are revealed based on choices made at each 'layer'. So I've used naming convention which represents the order in which each div becomes visible - 'a100', 'a200', 'a300' for the first 'layer'; 'b100', 'b200', 'b300' for the second; 'c100, 'c200', 'c300' for the third ... etc I'm writing the javascript functions to hide and show the appropriate divs and its getting out of hand pretty...
1
1186
by: shapper | last post by:
Hello, I have the following function: function show(id) { var allIds = , ids, i=0; while(ids = allIds) { document.getElementById(ids).style.display=ids==id?'block':'none'; } }
5
4480
by: Mike P | last post by:
How would I show or hide a div that is using client side Javascript based upon a server side variable? Here are my divs : <div id="idButton5" class="otherLeftBarLink" onmouseover="javascript: changeStylesMouseOver('5');" onmouseout="javascript: changeStylesMouseOut('5');" onclick="location='/AddProject.aspx'"> <div class="leftBarLinkText"> Add Project
1
3820
oranoos3000
by: oranoos3000 | last post by:
hi would you please help me i have a online shopping center that i show pictures of the my product in home page. in the InterExplorer pictures is shown correctly but in Firefox browser is shown properties alt in img tag istead of picture . place of the pictures is saved in the database(my database is with mysql) and in home page i fetch properties of the product and address of place that pictures is located output of the code in the...
0
10007
marktang
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...
0
9854
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,...
0
11297
Oralloy
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...
1
10990
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 Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
10504
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
9693
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, 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...
1
8059
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 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...
0
6100
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4734
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

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.