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

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>
<input id="numField1" name="en10" class="fd">

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

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


I am using an external css by followwing method

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

Who is Participating?
it could be a caching problem on the browser (or even proxy side -- if they use one)!
Try adding this HTTP headers to your page response:

Cache-Control: private
Pragma: no-cache
Expires: 0

Hope this help.
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>
<input id="numField2" name="en2" class="fd">
<? } ?>

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.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.