ERROR: object required.can u help me?

[maartha]

i have a js code which displays two html div on a click event.code is like this.

  function display()
{
    document.getElementById('headingtd1').bgColor="#EFEBEF";
    document.getElementById('headingtd1').border = "2px solid #EFEBEF";
    document.getElementById('values0').style.display="none";
    document.getElementById('values2').style.display="none";
    document.getElementById('values1').style.dislay="block";
 
       return true;
}
 
function select_div(parmtr)
    {       // -----------LINE 31--------------
     for(var p=0; p<3; p++)
        {
        document.getElementById('values'+p).style.display = "none";
        document.getElementById('headingtd'+p).bgColor="#FFFFFF";
        document.getElementById('headingtd'+p).border ='0';
     }
    document.getElementById('values'+parmtr).style.display = 'block';
    document.getElementById('headingtd'+parmtr).bgColor='#EFEBEF';
    document.getElementById('headingtd'+parmtr).border = '2px solid #EFEBEF';
    return true;
}
 

here i hav 3 div values0,values1 and values2 also headingtd0,headingtd1 and headingtd2 are 3 table-td id's .function display is calling in pageload event and select_div in a click event. here my problem is getting an error in page load which says that "Line:31 char:9 Object required". line 31 is the opening of the for loop.

[gits]

hi ...

welcome to TSDN ...

could you please post the related html too? so that we may have a closer look at it?

kind regards

[maartha]

ya sure.............

function display()
{
    document.getElementById('headingtd1').bgColor="#EFEBEF";
    document.getElementById('headingtd1').border = "2px solid #EFEBEF";
    document.getElementById('values0').style.display="none";
    document.getElementById('values2').style.display="none";
    document.getElementById('values1').style.dislay="block";
 
    return true;
}
 
function select_div(parmtr)
    {       // -----------LINE 31--------------
     for(var p=0; p<3; p++)
        {
        document.getElementById('values'+p).style.display = "none";
        document.getElementById('headingtd'+p).bgColor="#FFFFFF";
        document.getElementById('headingtd'+p).border ='0';
    }
    document.getElementById('values'+parmtr).style.dis  play = 'block';
    document.getElementById('headingtd'+parmtr).bgColo  r='#EFEBEF';
    document.getElementById('headingtd'+parmtr).border   = '2px solid #EFEBEF';
    return true;
}

//---------------------html---------------------------------------------------------------

[HTML]<table>
<tr>
<td id="headingtd0" nowrap align=center style="border:0px solid ; width:150; "><a class=browseby href="/" onclick="select_div(0); return false" >Keywords</a></td>
<td>&nbsp;</td>

<td id="headingtd1" nowrap align=center style="border:0px solid ; width:150;"><a class=browseby href="/" onclick="select_div(1); return false;">Locations</a></td>
<td>&nbsp;</td>

<td id="headingtd2" nowrap align=center style="border:0px solid ; width:150;"><a class=browseby href="/" onclick="select_div(2); return false;">Company</a></td>

</table>
</tr>

<div id="values0">
<table border="0" cellpadding="5" cellSpacing="0" width="700">
<tr>
<td></td>
</tr>
</table>
</div>


<div id="values1">
<table border="0" cellpadding="5" cellSpacing="0" width="700">
<tr>
<td></td>
</tr>
</table>

</div>
</center>

<div id="values2">
<table border="0" cellpadding="5" cellSpacing="0" width="700">
<tr>
<td></td>
</tr>
</table>

</div>[/HTML]





here i hav 3 div values0,values1 and values2 also headingtd0,headingtd1 and headingtd2 are 3 table-td id's .function display is calling in pageload event and select_div in a click event. here my problem is getting an error in page load which says that "Line:31 char:9 Object required". line 31 is the opening of the for loop.

[gits]

hi ...

the following setup works ... i only fixed the wrong placed </tr> of your first table:

[HTML]
<script type="text/javascript">
function display()
{
document.getElementById('headingtd1').bgColor="#EF EBEF";
document.getElementById('headingtd1').border = "2px solid #EFEBEF";
document.getElementById('values0').style.display=" none";
document.getElementById('values2').style.display=" none";
document.getElementById('values1').style.dislay="b lock";

return true;
}

function select_div(parmtr)
{ // -----------LINE 31--------------
for(var p=0; p<3; p++)
{
document.getElementById('values'+p).style.display = "none";
document.getElementById('headingtd'+p).bgColor="#F FFFFF";
document.getElementById('headingtd'+p).border ='0';
}
document.getElementById('values'+parmtr).style.dis play = 'block';
document.getElementById('headingtd'+parmtr).bgColo r='#EFEBEF';
document.getElementById('headingtd'+parmtr).border = '2px solid #EFEBEF';
return true;
}
</script>

<body onload="display();">
<table>
<tr>
<td id="headingtd0" nowrap align=center style="border:0px solid ; width:150; ">
<a class=browseby href="/" onclick="select_div(0); return false" >Keywords</a>
</td>
<td>&nbsp;</td>
<td id="headingtd1" nowrap align=center style="border:0px solid ; width:150;">
<a class=browseby href="/" onclick="select_div(1); return false;">Locations</a>
</td>
<td>&nbsp;</td>
<td id="headingtd2" nowrap align=center style="border:0px solid ; width:150;">
<a class=browseby href="/" onclick="select_div(2); return false;">Company</a>
</td>
</tr>
</table>

<div id="values0">
<table border="0" cellpadding="5" cellSpacing="0" width="700">
<tr>
<td>test</td>
</tr>
</table>
</div>
<div id="values1">
<table border="0" cellpadding="5" cellSpacing="0" width="700">
<tr>
<td>test2</td>
</tr>
</table>
</div>
<div id="values2">
<table border="0" cellpadding="5" cellSpacing="0" width="700">
<tr>
<td>test3</td>
</tr>
</table>
</div>
</body>
[/HTML]
so i cannot find another error? ... which browser do you use?

kind regards