Javascript Hell Options

[Doyley]

Hi all,

I've been trying to learn some Javascript but I am pretty awful. I have been adding some stuff to a page at

http://www.poolpockets.co.uk/eventsmain.ph...d=2669&bp=1

What I would like to do next is hide all rows from "Tournament Format" down to and including "Cash Prize Fund" unless tournament is selected from the radio buttons at the top.

I've tried a few things but can't get anything to work.

Does anybody have any ideas?

Cheers!!

[Christian J]

If you insert a DIV element with the CLASS name "toggle" inside each table cell you want to toggle, like this:

CODE

<td><div class="toggle">content</div></td>

you might use something like this script (note the additions in checkit1):

CODE

function toggle(display_value)
{
    var div=document.getElementsByTagName('div');
    for(var i=0; i<div.length; i++)
    {
        if(div[i].className=='toggle')
        {
            div[i].style.display=display_value;
        }
    }
}


function checkit1(){

for (i=0;i<document.events.etype.length;i++) {
    if (document.events.etype[i].checked) {
        user_input = document.events.etype[i].value;
    }
}

if(user_input=='1'){

document.events.funeventtype.disabled=false;
document.events.funeventtype.selectedIndex='Please Select';
toggle('none');
}

else{

document.events.funeventtype.disabled=true;
document.events.funeventtype.value='';
toggle('block');
}

}// END FUNCTION

To hide the cells when the page loads you also need the following after the HTML table:

CODE

<script type="text/javascript">
toggle('none');
</script>

The reason I toggle DIV elements and not the cells themselves is because the latter seems to be buggy in Firefox and Opera.

-------

You may also want to fix the validator errors: http://www.htmlhelp.com/cgi-bin/validate.c...d=2669&bp=1

[Doyley]

If you insert a DIV element with the CLASS name "toggle" inside each table cell you want to toggle, like this:

CODE

<td><div class="toggle">content</div></td>

you might use something like this script (note the additions in checkit1):

CODE

function toggle(display_value)
{
    var div=document.getElementsByTagName('div');
    for(var i=0; i<div.length; i++)
    {
        if(div[i].className=='toggle')
        {
            div[i].style.display=display_value;
        }
    }
}


function checkit1(){

for (i=0;i<document.events.etype.length;i++) {
    if (document.events.etype[i].checked) {
        user_input = document.events.etype[i].value;
    }
}

if(user_input=='1'){

document.events.funeventtype.disabled=false;
document.events.funeventtype.selectedIndex='Please Select';
toggle('none');
}

else{

document.events.funeventtype.disabled=true;
document.events.funeventtype.value='';
toggle('block');
}

}// END FUNCTION

To hide the cells when the page loads you also need the following after the HTML table:

CODE

<script type="text/javascript">
toggle('none');
</script>

The reason I toggle DIV elements and not the cells themselves is because the latter seems to be buggy in Firefox and Opera.

-------

You may also want to fix the validator errors: http://www.htmlhelp.com/cgi-bin/validate.c...d=2669&bp=1

That works like a dream. Many thanks for your time!!