Hiding Row (javascript-php-html-css)

[coool]

what do you think of this code? - it's not working what's wrong with it !

 

<script type="text/javascript">
function Show(e)
{
        if(document.getElementById(e).style.display == 'none')
        {
                document.getElementById(e).style.display = 'block';
        }
}
</script>

<tr id='criteria1'>
        <?echo CriteriaRow();?>
//this function have some form elements/html similar to the picture in one of my posts
</tr>

              <input type="button" value="Display Criteria" onClick="Show('criteria1');">

 

#criteria1
{
display: none;
}

 

when i click on the button.. nothing appear !

[gurroa]

Cause css style doesn't get into the element style definition. So the default value of style.display is empty string.

function Show(e) {
  document.getElementById(e).style.display = document.getElementById(e).style.display != 'block' ? 'block' : 'none';
  delete e;
}

[nogray]

instead of having the display in the style sheet declaration, have it in an inline style

<tr style="display:none;" id=".....">
....

Otherwise the if statment won't work (the style.display will be blank)