change jscript from fieldset to div 1

[thompom]

Hi,

Have a script that works fine for fieldsets, but would like
it to do the same with a DIV - at the moment there are three buttons with three hidden fieldsets - when someone clicks a radio button the style of the fieldset is set to 'inline' i would like it to do the same with hidden divs.
Have changed the fieldset to divs but didnt work - below is the working code for the fieldsets

thanks MG

javascript func

function toggleSet(rad) { 
var type = rad.value; 
 for(var k=0,elm;elm=rad.form.elements[k];k++)
if(elm.className=='item')
elm.style.display = elm.id==type? 'inline':'';
}

html

<style> 
fieldset{display: none; padding: 10px;} 
</style> 

<input name="x_siteid" type="radio" value="1" checked onclick="toggleSet(this)">
<input name="x_siteid" type="radio" value="2" onclick="toggleSet(this)">
<input name="x_siteid" type="radio" value="3" onclick="toggleSet(this)">

<fieldset id="1" class="item" style="width:260px"> 
stuff...
</fieldset>

<fieldset id="2" class="item" style="width:260px"> 
stuff...
</fieldset>

<fieldset id="3" class="item" style="width:260px"> 
stuff...
</fieldset>

 

[feherke]

Hi

[tt]div[/tt] are not [tt]form[/tt] elements so do not expect to find them there.

function toggleSet(rad)
{
  var type = rad.value;
  [red]var list=document.getElementsByTagName('div')[/red]
  for (var k=0,elm;elm=[red]list[/red][k];k++)
    if (elm.className=='item')
      elm.style.display = elm.id==type? 'inline':'';
}

<style>
[red]div.item[/red] {
  display: none;
  padding: 10px;
}
</style>

<input name="x_siteid" type="radio" value="1" checked onclick="toggleSet(this)">
<input name="x_siteid" type="radio" value="2" onclick="toggleSet(this)">
<input name="x_siteid" type="radio" value="3" onclick="toggleSet(this)">

<[red]div[/red] id="1" class="item" style="width:260px">
stuff... 1
</[red]div[/red]>

<[red]div[/red] id="2" class="item" style="width:260px">
stuff... 2
</[red]div[/red]>

<[red]div[/red] id="3" class="item" style="width:260px">
stuff... 3
</[red]div[/red]>

Feherke.

http://rootshell.be/~feherke/

 

[thompom]

thanks - heres a *

...can you tell how to make a default <div id="1"> show on load of the page

have tried putting the following at the bottom of the form
but doesnt work

<script language="JavaScript">
<!--
toggleSet(1);
//-->
</script>

 

[feherke]

Hi

Of course it not works. The function expects a reference to a [tt]HTMLInputElement[/tt] object, not an integer.

toggleSet(document.forms[0].x_siteid[0])

By the way, the [tt]id[/tt] means identifier, so its value must be a valid identifier. That means, it must begin with a letter or underscore ( _ ). As far as I remember, Explorer used to fail if [tt]id[/tt]s are malformed.

Feherke.

http://rootshell.be/~feherke/

 

[thompom]

thanks again