• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Paul Clapham
  • Ron McLeod
  • Bear Bibeault
  • Liutauras Vilda
Sheriffs:
  • Jeanne Boyarsky
  • Junilu Lacar
  • Henry Wong
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Jj Roberts
  • Tim Holloway
  • Piet Souris
Bartenders:
  • Himai Minh
  • Carey Brown
  • salvin francis

expand and collapse

 
Greenhorn
Posts: 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,

Following is my code ......


<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
Untitled Page
</title>

<script type="text/javascript">

function poorman_toggle(id)
{
var tr = document.getElementById(id);
if (tr==null) { return; }
var bExpand = tr.style.display == '';
tr.style.display = (bExpand ? 'none' : '');
}
function poorman_changeimage(id, sMinus, sPlus)
{
var img = document.getElementById(id);
if (img!=null)
{
var bExpand = img.src.indexOf(sPlus) >= 0;
if (!bExpand)
img.src = sPlus;
else
img.src = sMinus;
}
}

function Toggle_trGrpHeader2()
{
poorman_changeimage('trGrpHeader2_Img', 'minus.jpg', 'plus.jpg');
poorman_toggle('row1');
poorman_toggle('row2');
poorman_toggle('row3');
}

function Toggle_trGrpHeader3()
{
poorman_changeimage('trGrpHeader3_Img', 'minus.jpg', 'plus.jpg');
poorman_toggle('row4');
poorman_toggle('row5');
poorman_toggle('row6');
}

function Toggle_trGrpHeader1()
{
poorman_changeimage('trGrpHeader1_Img', 'minus.jpg', 'plus.jpg');
poorman_toggle('trRow1');

}
function Toggle_trGrpHeader4()
{
poorman_changeimage('trGrpHeader4_Img', 'minus.jpg', 'plus.jpg');
poorman_toggle('row4');
poorman_toggle('row5');
poorman_toggle('row6');
poorman_toggle('row1');
poorman_toggle('row2');
poorman_toggle('row3');
poorman_toggle('trGrpHeader2');
poorman_toggle('trGrpHeader3');

}
</script>

</head>
<body>

<div>
<table border="1">
<tr id="trGrpHeader1">
<td colspan="4"><span onclick="javascript:Toggle_trGrpHeader1();"><img src="minus.jpg" id="trGrpHeader1_Img"/>Pretend this is a header for row 1</span></td>
</tr>

<tr id="trRow1">
<td> Hello</td>
<td class="number">10</td>
<td class="number">1999-11-17 00:00:00</td>
<td class="number">1999-12-15 00:00:00</td>
</tr>

<tr id="trGrpHeader4">
<td colspan="4"><span onclick="javascript:Toggle_trGrpHeader4();"><img src="minus.jpg" id="trGrpHeader4_Img"/>Sample</span></td>
</tr>

<tr id="trGrpHeader2">
<td colspan="4"><span onclick="javascript:Toggle_trGrpHeader2();"><img src="minus.jpg" id="trGrpHeader2_Img"/>Pretend this is a header</span></td>
</tr>

<tr id="row1">
<td> AROUT</td>
<td class="number">10743</td>
<td class="number">1997-11-17 00:00:00</td>
<td class="number">1997-12-15 00:00:00</td>
</tr>
<tr id="row2">
<td> AROUT</td>
<td class="number">10768</td>
<td class="number">1997-12-08 00:00:00</td>
<td class="number">1998-01-05 00:00:00</td>
</tr>
<tr id="row3">
<td> AROUT</td>
<td class="number">10793</td>
<td class="number">1997-12-24 00:00:00</td>
<td class="number">1998-01-21 00:00:00</td>
</tr>


<tr id="trGrpHeader3">
<td colspan="4"><span onclick="javascript:Toggle_trGrpHeader3();"><img src="minus.jpg" id="trGrpHeader3_Img"/>header</span></td>
</tr>

<tr id="row4">
<td> AROUT</td>
<td class="number">10743</td>
<td class="number">1997-11-17 00:00:00</td>
<td class="number">1997-12-15 00:00:00</td>
</tr>
<tr id="row5">
<td> AROUT</td>
<td class="number">10768</td>
<td class="number">1997-12-08 00:00:00</td>
<td class="number">1998-01-05 00:00:00</td>
</tr>
<tr id="row6">
<td> AROUT</td>
<td class="number">10793</td>
<td class="number">1997-12-24 00:00:00</td>
<td class="number">1998-01-21 00:00:00</td>
</tr>

</table>
</div>
</body>
</html>


When i click on "Minus sign of Sample" "Pretend this is a header" is in expanded state and "header" is in expanded state it is collapsing but when Pretend this is a header and header is collapsed the rows under Pretend this is a header and header are displaying ...... it should not display .... Could you please any one help me out ..... Thanks in advance

minus.jpg
[Thumbnail for minus.jpg]
plus.jpg
[Thumbnail for plus.jpg]
 
Think of how dumb the average person is. Mathematically, half of them are EVEN DUMBER. Smart tiny ad:
Thread Boost feature
https://coderanch.com/t/674455/Thread-Boost-feature
reply
    Bookmark Topic Watch Topic
  • New Topic