asked on

Table Rows Does not display - CSS / DHTML

I am using an html form with more than 60 fields to collect our monthly data.
The fields are displayed to the clients as per their login by outputting the class attributes (show or hide) from a server side script.
Sometimes even after the server side script writing the `show` attribute, some rows does not display on the browser (It appears on refresh). This does not happen always. May be 5 or 6 out of 100 times. What could be the reason?

Part of the HTML Code is given below

Thomas------------------------------------------
The class attribute $at1 $at2 etc will be written as "show" or "hide" by the server side script
as per the client login. The styles `show` & hide are given below
..................
hide {
visibility: hidden; display: none; }
show {
visibility: visible; display: block; height: 34px; }
w1 {
text-align: center; border-bottom: solid 1px #333333;}
fd {
text-align: center; background-color: #fffff0;}
.................
A sample of the html is given below. There are total 63 rows. As per the client login,
some rows will be "show" and some "hide"
-------------------------------------------

<tr id="E1" class="<?php echo "$at1"; ?>">
<td colspan="3" class="w1"> Complaints Recd. </td>
<td>
<input id="numField1" name="en10" class="fd">
</td></tr>

<tr id="E2" class="<?php echo "$at2"; ?>">
<td colspan="3" class="w1"> Complaints Attended</td>
<td>
<input id="numField2" name="en2" class="fd">
</td></tr>

<tr id="E12" class="<?php echo "$at3"; ?>">
<td colspan="3" class="w1"> Complaints Pending </td>
<td>
<input id="numField3" name="en12" class="fd">
</td></tr>

------------------------

I am using an external css by followwing method

<link rel="stylesheet" href="includes/entry_form.css" type="text/css">

----------------------

peeldog

Do you need to hide them with dhtml (class="hide"), or can you hide them with php...

<? if($at1=="show") { ?>
<tr id="E2">
<td colspan="3" class="w1"> Complaints Attended</td>
<td>
<input id="numField2" name="en2" class="fd">
</td></tr>
<? } ?>

The reason you would want to hide them with dhtml is if you want to show them again on the client side.

You could also try:

<tr id="E12" style="<?=$at3 ?>">

and set $at3 as "hidden".

if you want to unhide it with dhtml, I think you can use this javascript:

document.getElementById("E12").style.display = 'block';

Failing all that, you could do the hiding during the body onload (<BODY onload="[codehere]">) and see if the renderer behaves.

ASKER CERTIFIED SOLUTION

liviutudor

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer