Log in

View Full Version : Toggle Show Hide Div - Problem


the penguin
07-22-2010, 02:46 PM
Hello,

I'm using this script to toggle between div's from a drop down select action. Is there a way I can expand this script to allow me to toggle with other divs?

Script:

<script type='text/javascript'>
function toggleSubmit(obj){

count=0
while(document.getElementById("d"+count)){
document.getElementById("d"+count).style.display="none"
count++
}
document.getElementById("d"+obj.selectedIndex).style.display="block"

}
</script>

HTML:

<form>
<select onChange="toggleSubmit(this)">
<option>AAA</option>
<option>BBB</option>
</select>
</form>

<div id="d0" style="display:block">
AAA
</div>

<div id="d1" style="display:none">
BBB
</div>

I tried adding div's with id's of d2 and d3, but no luck...

Thank you for the help.
vwphillips
07-22-2010, 03:28 PM
no sure I understand but


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
<script type='text/javascript'>

function toggleSubmit(nme,obj){
var count=0
while(document.getElementById(nme+count)){
document.getElementById(nme+count).style.display=obj.selectedIndex!=count?"none":"block"
count++
}
}

</script>
</head>

<body>
<form>
<select onChange="toggleSubmit('d',this)">
<option>AAA</option>
<option>BBB</option>
<option>CCC</option>
<option>DDD</option>
</select>
<select onChange="toggleSubmit('e',this)">
<option>EEE</option>
<option>FFF</option>
<option>GGG</option>
<option>HHH</option>
</select>
</form>

<div id="d0" style="display:block">
AAA
</div>

<div id="d1" style="display:none">
BBB
</div>
<div id="d2" style="display:none">
CCC
</div>

<div id="d3" style="display:none">
DDD
</div>

<div id="e0" style="display:block">
EEE
</div>

<div id="e1" style="display:none">
FFF
</div>
<div id="e2" style="display:none">
GGG
</div>

<div id="e3" style="display:none">
HHH
</div>
</body>

</html>
the penguin
07-22-2010, 05:29 PM
Than you very much! :)