Hide table data

Hi Guys

I need to modify an existing javascript function - which is called in a Classic ASP script

//Javascript code
    function EC(TheTR) {
        var DataTR = eval('document.all.' + TheTR);
        if (DataTR.style.display == "block" || DataTR.style.display == "") {
            DataTR.style.display = "none";
        }
        else {
            DataTR.style.display = "block";
        }
    }

Open in new window


I call it like this

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <table border="1" cellpadding="1" cellspacing="1">
    <tr height="26px" >
        <td id="eListing0" valign='top'>Information<br /></td>
      <td  valign='top' width="10px"><img src="http://rosemax.com.au/HorseRecords/images/chevron_left.gif" border="0" title="Click to hide the left side bar" onclick="Javascript:EC('eListing0');EC('eListing1');" style="cursor:hand"></td>
        <td height="26px"valign='top' width="800px">Heading</td>
    </tr>
    <tr>
        <td  id="eListing1" valign="top" align="left">C </td>
        <td valign='top' align="left">D </td>
        <td valign='top' align="left">E </td>
    </tr>
</table>
  
</body>
</html>

Open in new window



What I would like to do with the javascript function is rather than call it twice to hide the td's eListing0 and eListing1 (see onClick event of the image), is have it itinerate through the  td by its object id with a number on the end of it - ie eLising0, eListing1 etc.

I have uploaded the code and html to http://jsbin.com/EKIGik/2/edit

MTIA

DWE
LVL 1
dwe0608Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

shishir_sriCommented:
JavaScript:

    function EC() {
        var i = 0;
        var id = 'eListing' + i;
        while(document.getElementById(id) != null) {
          var DataTR = document.getElementById(id);
          if (DataTR.style.display == "block" || DataTR.style.display === "")
          {
            DataTR.style.display = "none";
          }
          else
          {
            DataTR.style.display = "block";
          }
          i++;
          id = 'eListing' + i;
        }
        
    }

Open in new window


HTML:

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <table border="1" cellpadding="1" cellspacing="1">
    <tr height="26px" >
        <td id="eListing0" valign='top'>Information<br /></td>
      <td  valign='top' width="10px"><img src="http://rosemax.com.au/HorseRecords/images/chevron_left.gif" border="0" title="Click to hide the left side bar" onclick="Javascript:EC();" style="cursor:hand"></td>
        <td height="26px"valign='top' width="800px">Heading</td>
    </tr>
    <tr>
        <td  id="eListing1" valign="top" align="left">C </td>
        <td valign='top' align="left">D </td>
        <td valign='top' align="left">E </td>
    </tr>
</table>
  
</body>
</html>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Sar1973Commented:
If you have 5 elements:
for (i = 0; i < 5; i++) {
	eval("var DataTR =eLising"+i+";");
if (DataTR.style.display == "block" || DataTR.style.display == "") {
            DataTR.style.display = "none";
        } else {
            DataTR.style.display = "block";
        }
}
Obviously 

Open in new window

you can declare directly the variables with their number in the eval declaration, with a loop referred to the single variable and not to a generic DataTR.
0
dwe0608Author Commented:
Great input guys - thanks greatly for the assistance and examples what what can be done.

Regards

DWE
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP

From novice to tech pro — start learning today.