We help IT Professionals succeed at work.
Get Started

How to show/hide multiple independent DIVS with javascript (Two Seperate Elements)?

SysAdmin1030
SysAdmin1030 asked
on
1,339 Views
Last Modified: 2012-05-11
I'm in a bit of a predicament.

I need a quick and easy to implement solution preferably based in javascript.

I'm attempting to create a splash page that needs to use a show/hide feature for two different sections for the page.

Here is the idea.

First, you select a region which makes a list of locations show up for that region. This process is complete using the following javascript:

<script language="JavaScript">
//here you place the ids of every element you want.
var ids=new Array('a1','a2','a3','a4','a5','a6','a7','a8','b9','b10');

function switchid(id){	
	hideallids();
	showdiv(id);
}

function hideallids(){
	//loop through the array and hide each element by id
	for (var i=0;i<ids.length;i++){
		hidediv(ids[i]);
	}		  
}

function hidediv(id) {
	//safe function to hide an element with a specified id
	if (document.getElementById) { // DOM3 = IE5, NS6
		document.getElementById(id).style.display = 'none';
	}
	else {
		if (document.layers) { // Netscape 4
			document.id.display = 'none';
		}
		else { // IE 4
			document.all.id.style.display = 'none';
		}
	}
}

function showdiv(id) {
	//safe function to show an element with a specified id
		  
	if (document.getElementById) { // DOM3 = IE5, NS6
		document.getElementById(id).style.display = 'block';
	}
	else {
		if (document.layers) { // Netscape 4
			document.id.display = 'block';
		}
		else { // IE 4
			document.all.id.style.display = 'block';
		}
	}
}


</script>

Open in new window


The second part is where the script above can no longer support my needs.

After selecting the region you can select one of the locations which would then show/hide a variety of information about that location.

Essentially, I have one show/hide script that works for selecting a region which shows the locations in that region. Now, I need to add an additional component that allows me to select the location and show information about that location without screwing everything else up. All on one page. No database. Yikes!

Any help would be greatly appreciate!
Comment
Watch Question
This problem has been solved!
Unlock 1 Answer and 4 Comments.
See Answer
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE