473,698 Members | 2,261 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Please help - Hide a table while show a table

Hi,

I have 2 tables in an html page. I have div them separately and id them
as id1 and id2. I have a link there. What I need is click the link to
hide one table and show the other and verse when click the link again.
I tried many ways in javascript but failed. Could someone please help?

Thanks a lot!

Dec 10 '06 #1
6 1993
VK

mi********@gmai l.com wrote:
Hi,

I have 2 tables in an html page. I have div them separately and id them
as id1 and id2. I have a link there. What I need is click the link to
hide one table and show the other and verse when click the link again.
I tried many ways in javascript but failed. Could someone please help?
Show your last try, we'll start from there.

Dec 10 '06 #2
ASM
mi********@gmai l.com a écrit :
Hi,

I have 2 tables in an html page. I have div them separately and id them
as id1 and id2. I have a link there. What I need is click the link to
hide one table and show the other and verse when click the link again.
I tried many ways in javascript but failed. Could someone please help?
<button onclick="
var id1 = document.getEle mentById('id1') .style;
var id2 = document.getEle mentById('id2') .style;
if(typeof(asm)= ='undefined') {
// 1st time you press button : hide div 2
// asm is a pointer created at this moment
// to avoid to hide 2nd div at each next pressure
asm = true;
id2.display = 'none';
}
else
{
id1.display = id1.display=='' ? 'none' : '';
id2.display = id2.display=='' ? 'none' : '';
};">hide / show </button>

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
Dec 10 '06 #3
Hi, VK

well, actually this javascript should be working in a jsp page finally,
not html.

I am guessing jsp should not be embbed into jsp?

thanks

On Dec 10, 1:53 pm, "VK" <schools_r...@y ahoo.comwrote:
michael...@gmai l.com wrote:
Hi,
I have 2 tables in an html page. I have div them separately and id them
as id1 and id2. I have a link there. What I need is click the link to
hide one table and show the other and verse when click the link again.
I tried many ways in javascript but failed. Could someone please help?Show your last try, we'll start from there.
Dec 10 '06 #4
ASM wrote on 10 dec 2006 in comp.lang.javas cript:
<button onclick="
var id1 = document.getEle mentById('id1') .style;
var id2 = document.getEle mentById('id2') .style;
if(typeof(asm)= ='undefined') {
// 1st time you press button : hide div 2
// asm is a pointer created at this moment
// to avoid to hide 2nd div at each next pressure
asm = true;
id2.display = 'none';
}
else
{
id1.display = id1.display=='' ? 'none' : '';
id2.display = id2.display=='' ? 'none' : '';
};">hide / show </button>

A global variable remembering the status is not even neccessary:

<script type='text/javascript'>
function swap(button,a,b ) {
var x = document.getEle mentById(a).sty le;
var y = document.getEle mentById(b).sty le;
var swapper = y.display == 'none';
x.display = swapper ? 'none' : '';
y.display = swapper ? '' : 'none';
button.innerHTM L = swapper ?
'hide '+b+' / show '+a :
'hide '+a+' / show '+b;
}
</script>

<button onclick="swap(t his,'id1','id2' )">
hide div id2</button>
<br><br>
<div id='id1'>This is id1</div>
<div id='id2'>This is id2</div>
<br><br>
<button onclick="swap(t his,'id3','id4' )">
hide div id4</button>
<br><br>
<div id='id3'>This is id3</div>
<div id='id4'>This is id4</div>
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Dec 10 '06 #5
Thanks, Evertjan,

Your way works sooooooooooooo wellllll~!

Cheers

On Dec 10, 3:37 pm, "Evertjan." <exjxw.hannivo. ..@interxnl.net wrote:
ASM wrote on 10 dec 2006 in comp.lang.javas cript:
<button onclick="
var id1 = document.getEle mentById('id1') .style;
var id2 = document.getEle mentById('id2') .style;
if(typeof(asm)= ='undefined') {
// 1st time you press button : hide div 2
// asm is a pointer created at this moment
// to avoid to hide 2nd div at each next pressure
asm = true;
id2.display = 'none';
}
else
{
id1.display = id1.display=='' ? 'none' : '';
id2.display = id2.display=='' ? 'none' : '';
};">hide / show </button>A global variable remembering the status is not even neccessary:

<script type='text/javascript'>
function swap(button,a,b ) {
var x = document.getEle mentById(a).sty le;
var y = document.getEle mentById(b).sty le;
var swapper = y.display == 'none';
x.display = swapper ? 'none' : '';
y.display = swapper ? '' : 'none';
button.innerHTM L = swapper ?
'hide '+b+' / show '+a :
'hide '+a+' / show '+b;}</script>

<button onclick="swap(t his,'id1','id2' )">
hide div id2</button>
<br><br>
<div id='id1'>This is id1</div>
<div id='id2'>This is id2</div>
<br><br>
<button onclick="swap(t his,'id3','id4' )">
hide div id4</button>
<br><br>
<div id='id3'>This is id3</div>
<div id='id4'>This is id4</div>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Dec 10 '06 #6
ASM
Evertjan. a écrit :
ASM wrote on 10 dec 2006 in comp.lang.javas cript:
Hi,
A global variable remembering the status is not even neccessary:
Not too bad :-)
--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
Dec 10 '06 #7

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

Similar topics

2
54965
by: John M | last post by:
I want to hide the first row in my table and if a user click on a show button than show it. If it is visible than user can hide it with click a hide button. In default I hide it with: <tr id="ds" style="display:none"> but how can I make it visible or hide it dynamicaly? Is it possible to do it not with TR but with TABLE?
7
4144
by: Mad Scientist Jr | last post by:
Through messing around I got IE6 (win xp) to show/hide a table row. I gave my <TR> an ID of "trRow" and trRow.style.display='none'; hides it trRow.style.display='block'; displays it (will any value other than 'none' display on IE6?) I tried enclosing the <TR></TR> inside a <DIV> tag, and hiding that, but it doesn't work for some reason.
19
6898
by: dmiller23462 | last post by:
Hi guys....I have absolutely NO IDEA what I'm doing with Javascript but my end result is I need two text boxes to stay hidden until a particular option is selected....I've cobbled together the JavaScript in this code from a couple different sites but I'm not 100% sure what each line is doing...This is the ASP code that I'm using for the page....Take a look at the JavaScript code and please let me know what each line is doing....I have been...
10
4649
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 with the javascript in a toggle fashion. the problem is a know very little javascript and have become incredibly frustrated because i went ahead thinking it was going to be like C. its not. I know i can use these lines to do the actual work:
1
14539
by: Oliver Hoehle | last post by:
Hello! This ist the source-code for an editable combobox implemented with HTML,CSS and Javascript. I have tested it with IE and Mozilla. But I don't know, if it will work in other browsers (Opera, Konqueror, etc.) So I need your feedback... Regards
2
12184
by: MOHSEN KASHANI | last post by:
Hi, I am trying to hide some form elements in a form by default and show/hide depending on which radio button is clicked. This is what I have but it is not working: <head> <style> ..noshow { display: none; }
5
2138
by: Dautkhanov | last post by:
Hello all ! I have my own library for web-design building - active forms, lists. I am going to build tabbing component. The complexity in this process is that all web forms uniformed and are built as TABLEs, where each field is TR. Tabs have to show/hide some of table rows. I don't know how TR's properties must be changed in order to hide them all.
1
4169
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. I don`t want to change the way i have used to show and hide layers. check down code :- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html...
18
7559
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...
0
8680
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
8609
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
9030
jinu1996
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...
0
8871
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...
1
6528
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
5861
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 then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4622
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
2335
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2007
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 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...

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.