Hiding multiple elements...

[fdgsogc]

I have dynmically created several id values for some div elements that I want to show and hide.

I am using the following script to show and hide.

/* Shows address details  */
	function ShowAddress18(addressid18) {
	document.getElementById('addressid18').style.display = "block";
	}

/* Hides address details */
	function HideAddress18(addressid18) {
	document.getElementById('addressid18').style.display = "none";
	}

I am using an OnClick event to show my elements. However, as I show one div tag I want to hide all other div tags. Because I have dynamically created the "id" values for the div tags, I'd like to use a single "hide command" when using the OnClick. Here is my current OnClick code.

onClick="HideAddress65('addressid65'),
HideAddress66('addressid66'),
ShowAddress17('addressid17')"

I'd like to use a common code for hiding all div tags.

Here's my question. Can I use a wildcard character as a catch all. For instance, can I do something like this.

Onclick="HideAddress*('addressid*'),ShowAddress17('addressed17')"

Where the * is a wildcard that will hide all elements starting with "addressid".

 

[cLFlaVA]

first of all, javascript commands should be separated by semi-colons, not commas.

second of all, i'd do something like this:

function showOne(theOneToShow) {
    var allDivs = document.getElementsByTagName('div');
    for (var i = 0; i < allDivs.length; i++) {
        if (allDivs[i].id.indexOf('addressid') == 0) {
            if (allDivs[i].id <> theOneToShow) {
                // call the hide function
                callHideFunction(allDivs[i].id);
            } else {
                // call the show function
                callShowFunction(theOneToShow);
            }
        }
    }
}

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[trollacious]

While this should ACTUALLY go in the Javascript forum, putting all the code in one function, using Cory's as a base, would be:

function showOne(showID)
{
var allDivs = document.getElementsByTagName('div');
for (var di = 0; di < allDivs.length; di++)
  {
  if (allDivs[di].id.indexOf('addressid') == 0)
    {
    allDivs[di].style.display='none';
    }
  }
document.getElementById(showID).style.display='block';
}

Lee

 

[cLFlaVA]

i originally had that but worried about flashing...

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[trollacious]

If there aren't a lot of DIVs on the page, the flashing won't be a problem. Since there's only one conditional in the loop, it executes pretty fast. If there's a problem with the div flashing, then setting the one to block initially and then setting the rest to none except the ID passed to the function will work, too.

Lee