/    Sign up×
Community /Pin to ProfileBookmark

function ot defined error but it is

Hey, i get an error showHide not defined but it is, please help me figure out wats wrong.

[code=php]
<link href=”/common/default.css” rel=”stylesheet” type=”text/css” />
<style type=”text/css”>

h2 {
color:navy;
font-family: Tahoma;
font-size:12px;
};

h3 {
color:black;
font-family: Tahoma;
font-size:12px;
};

h4 {
color:navy;
font-family: Tahoma;
font-size:14px;
};

h1 {
font-family: Tahoma;
font-size: 12px;
line-height: 12px;
} ;

table {
border-color: #000000;
border-spacing: 0px;
border-style: solid;
border-width: 2px;
cell-spacing: 0px;
width : 100%;
}

table.subtable {
border-color: #000000;
border-spacing: 0px;
border-style: solid;
border-width: 2px;
cell-spacing: 0px;
}

td, th {
font-family: Tahoma;
font-size: 10pt;
padding: 2px 0.5em;
white-space: nowrap;
}

td.dtnum {
text-align: right;
}

td.dtdate {
text-align : left;
}

td.clicktd {
color : navy;
}

th {
background-color: yellow;
}

th a {
color: #000080;
text-decoration: none;
}

th a:visited {
color: #000080;
}

th a:active, th a:hover {
color: #800000;
text-decoration: underline;
}

tr.alternateRow {
background-color: #e0e0e0;
}

td.sortedColumn {
background-color: #f0f0f0;
}

th.sortedColumn {
background-color: #b0b0b0;
}

tr.alternateRow td.sortedColumn {
background-color: #d0d0d0;
}

</style>

<script language=”JavaScript” type =”text/javascript”>
<!–
function showHide(row)
{
if(navigator.appName == “Microsoft Internet Explorer”)
{
row = getNextSiblingRow(row);
if(!row) return;
var className = row.className;
do{
row.style.display = (row.style.display == ‘none’) ? ‘block’ : ‘none’;
row = getNextSiblingRow(row);
}while(row && row.className == className)
}
else
{
var classCompare = row.className;
row = getNextSiblingRow(row);
if(!row) return;
var className = row.className;
do{
row.style.display = (row.style.display == ‘none’) ? ‘table-row’ : ‘none’;
row = getNextSiblingRow(row);
}while(row && row.className <> classCompare)
}
}

function getNextSiblingRow(row)
{
var result = null;
var candidat = row.nextSibling;
while(candidat)
{
if(candidat.tagName && candidat.tagName.toUpperCase() == ‘TR’){
result = candidat;
break;
}
candidat = candidat.nextSibling;
}
return result;
}
//–>
</script>
<HTML>
<TITLE>
Member – Transactions and Transaction Details
</TITLE>
<h2>
Member – Transactions and Transaction Details
</h2>
<hr size=”1″ color=”#000000″>
<BODY>
<TABLE width = ‘100%’ >
<TR>
<TD>M_UNIQUE</TD>
<TD>M_NAME</TD>
<TD>TRX_UNIQUE</TD>
<TD>TRX_I_PRICE_EX_VAT</TD>
<TD>TRXD_UNIQUE</TD>
<TD>TRXD_PLU_DESCRIPTION</TD>
<TD>TRXD_PLU_PRICE_EX_VAT</TD>
</TR>
<TR onClick=”showHide(this)” style=”cursor:hand; cursor:pointer;” class=”0″>
<TD>12</TD><TD>Pamela</TD>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</TR>
<TR onClick=”showHide(this)” style=”cursor:hand; cursor:pointer;” class=”2″ style=”display:none;”>
<TD colspan = ‘2’>&nbsp</TD>
<TD>4</TD><TD>6106</TD>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</TR>
<TR class=”4″ style=”display:none;”>
<TD colspan = ‘4’>&nbsp</TD>
<TD>66</TD><TD>PURITY 3 CEREAL 200G STRAW</TD><TD>513</TD>
</TR>
<TR class=”4″ style=”display:none;”>
<TD colspan = ‘4’>&nbsp</TD>
<TD>67</TD><TD>PANADO PAED SYRUP STRAWBERRY</TD><TD>1403</TD>
</TR>
<TR class=”4″ style=”display:none;”>
<TD colspan = ‘4’>&nbsp</TD>
<TD>68</TD><TD>PURITY 2 125ML SWEET POTA</TD><TD>341</TD>
</TR>
<TR class=”4″ style=”display:none;”>
<TD colspan = ‘4’>&nbsp</TD>
<TD>69</TD><TD>PURITY 2 125ML SWEET POTA</TD><TD>341</TD>
</TR>
<TR class=”4″ style=”display:none;”>
<TD colspan = ‘4’>&nbsp</TD>
<TD>70</TD><TD>ADCO DOL TABS 100’S</TD><TD>3508</TD>
</TR>
<TR class=”4″ style=”display:none;”>
<TD colspan = ‘4’>&nbsp</TD>
<TD>71</TD><TD>REDEMPTION</TD><TD>-2112</TD>
</TR>
</TABLE>
</BODY>
</HTML>
[/code]

what the function do is to when you click on a row is compares the rows that folow with the clicked row class and hides it if its not the same.

to post a comment
JavaScript

7 Comments(s)

Copy linkTweet thisAlerts:
@kloon_zaauthorAug 04.2006 — Got the problem, but now i have another problem, if i click on the top level row it hides the child but shows the children of the hidden child.
Copy linkTweet thisAlerts:
@sridhar_423Aug 04.2006 — at a first glance..

while(row && row.className <> classCompare) should be

while(row && row.className != classCompare)
Copy linkTweet thisAlerts:
@kloon_zaauthorAug 04.2006 — So i got it working but still a few bugs like when u click on the top level row and the lowest level row is closed it hides the middle level row and shows the lowest level. code attached

[upl-file uuid=594d0fc0-d52e-40ed-ab00-4a101331eeb5 size=1kB]test.zip[/upl-file]
Copy linkTweet thisAlerts:
@sridhar_423Aug 04.2006 — [code=php]if(navigator.appName == "Microsoft Internet Explorer")
{
row = getNextSiblingRow(row);
if(!row) return;
var className = row.className;
style = row.style.display;
wh = (style=="none")?"row && row.className == className" :"row";
do{
row.style.display = (row.style.display == 'none') ? 'block' : 'none';
row = getNextSiblingRow(row);
}while(eval(wh))
}[/code]


same type of change in the else block also .. shud solve ur problem
Copy linkTweet thisAlerts:
@kloon_zaauthorAug 04.2006 — It solved the problem but if you click now on the middle level one it hides the second top level row
Copy linkTweet thisAlerts:
@sridhar_423Aug 04.2006 — okie... the code given before works fine only when there is one record. It'll fail because for hiding them, while condition is based on just "row".

try it this way ..

choose your class names carefully bcos ur logic entirely depends on the numbers tat u r assigning to the "class" attribute.

[code=php]<link href="/common/default.css" rel="stylesheet" type="text/css" />
<style type="text/css">


h2 {
color:navy;
font-family: Tahoma;
font-size:12px;
};


h3 {
color:black;
font-family: Tahoma;
font-size:12px;
};

h4 {
color:navy;
font-family: Tahoma;
font-size:14px;
};


h1 {
font-family: Tahoma;
font-size: 12px;
line-height: 12px;
} ;


table {
border-color: #000000;
border-spacing: 0px;
border-style: solid;
border-width: 2px;
cell-spacing: 0px;
width : 100%;
}

table.subtable {
border-color: #000000;
border-spacing: 0px;
border-style: solid;
border-width: 2px;
cell-spacing: 0px;
}


td, th {
font-family: Tahoma;
font-size: 10pt;
padding: 2px 0.5em;
white-space: nowrap;
}

td.dtnum {
text-align: right;
}

td.dtdate {
text-align : left;
}



td.clicktd {
color : navy;
}

th {
background-color: yellow;
}


th a {
color: #000080;
text-decoration: none;
}

th a:visited {
color: #000080;
}

th a:active, th a:hover {
color: #800000;
text-decoration: underline;
}

tr.alternateRow {
background-color: #e0e0e0;
}

td.sortedColumn {
background-color: #f0f0f0;
}

th.sortedColumn {
background-color: #b0b0b0;
}

tr.alternateRow td.sortedColumn {
background-color: #d0d0d0;
}

</style>

<script language="JavaScript" type ="text/javascript">
<!--
function showHide(row)
{
if(navigator.appName == "Microsoft Internet Explorer")
{
var classCompare = row.className;
row = getNextSiblingRow(row);
if(!row) return;
var className = row.className;
style=row.style.display;
wh=(style == "none")?"row && row.className > classCompare && Number(row.className) < 10+Number(classCompare)":"row && Number(row.className) < 10+Number(classCompare)";
do{
row.style.display = (row.style.display == 'none') ? 'block' : 'none';
row = getNextSiblingRow(row);
}while(eval(wh))
}
else
{
var classCompare = row.className;
row = getNextSiblingRow(row);
if(!row) return;
var className = row.className;
style=row.style.display;
wh=(style == "none")?"row && row.className > classCompare && Number(row.className) < 10+Number(classCompare)":"row && Number(row.className) < 10+Number(classCompare)";
do{
row.style.display = (row.style.display == 'none') ? 'table-row' : 'none';
row = getNextSiblingRow(row);
}while(eval(wh))
}
}

function getNextSiblingRow(row)
{
var result = null;
var candidat = row.nextSibling;
while(candidat)
{
if(candidat.tagName && candidat.tagName.toUpperCase() == 'TR'){
result = candidat;
break;
}
candidat = candidat.nextSibling;
}
return result;
}
//-->
</script>
<HTML>
<TITLE>
Member - Transactions and Transaction Details
</TITLE>
<h2>
Member - Transactions and Transaction Details
</h2>
<hr size="1" color="#000000">
<BODY>
<TABLE width = '100%' >
<TR>
<TD>M_UNIQUE</TD>
<TD>M_NAME</TD>
<TD>TRX_UNIQUE</TD>
<TD>TRX_I_PRICE_EX_VAT</TD>
<TD>TRXD_UNIQUE</TD>
<TD>TRXD_PLU_DESCRIPTION</TD>
<TD>TRXD_PLU_PRICE_EX_VAT</TD>
</TR>

<TR onClick="showHide(this)" style="cursor:hand; cursor:pointer;" class="10">
<TD>12</TD><TD>Pamela</TD>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</TR>

<TR onClick="showHide(this)" style="cursor:hand; cursor:pointer;" class="12" style="display:none;">
<TD colspan = '2'>&nbsp</TD>
<TD>4</TD><TD>6106</TD>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</TR>

<TR class="14" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>66</TD><TD>PURITY 3 CEREAL 200G STRAW</TD><TD>513</TD>
</TR>

<TR class="14" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>67</TD><TD>PANADO PAED SYRUP STRAWBERRY</TD><TD>1403</TD>
</TR>

<TR class="14" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>68</TD><TD>PURITY 2 125ML SWEET POTA</TD><TD>341</TD>
</TR>

<TR class="14" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>69</TD><TD>PURITY 2 125ML SWEET POTA</TD><TD>341</TD>
</TR>

<TR class="14" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>70</TD><TD>ADCO DOL TABS 100'S</TD><TD>3508</TD>
</TR>

<TR class="14" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>71</TD><TD>REDEMPTION</TD><TD>-2112</TD>
</TR>

<TR onClick="showHide(this)" style="cursor:hand; cursor:pointer;" class="20">
<TD>12</TD><TD>Pamela</TD>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</TR>

<TR onClick="showHide(this)" style="cursor:hand; cursor:pointer;" class="22" style="display:none;">
<TD colspan = '2'>&nbsp</TD>
<TD>4</TD><TD>6106</TD>
<td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
</TR>

<TR class="24" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>66</TD><TD>PURITY 3 CEREAL 200G STRAW</TD><TD>513</TD>
</TR>

<TR class="24" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>67</TD><TD>PANADO PAED SYRUP STRAWBERRY</TD><TD>1403</TD>
</TR>
<TR class="24" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>68</TD><TD>PURITY 2 125ML SWEET POTA</TD><TD>341</TD>
</TR>

<TR class="24" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>69</TD><TD>PURITY 2 125ML SWEET POTA</TD><TD>341</TD>
</TR>

<TR class="24" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>70</TD><TD>ADCO DOL TABS 100'S</TD><TD>3508</TD>
</TR>

<TR class="24" style="display:none;">
<TD colspan = '4'>&nbsp</TD>
<TD>71</TD><TD>REDEMPTION</TD><TD>-2112</TD>
</TR>
</TABLE>
</BODY>
</HTML>[/code]
Copy linkTweet thisAlerts:
@kloon_zaauthorAug 04.2006 — That still doesnt work, found another way thats much easier

<i>
</i>if(navigator.appName == "Microsoft Internet Explorer")
{
var classCompare = row.className;
row = getNextSiblingRow(row);
if(!row) return;
var className = row.className;
do{
if(row.className &gt; className)
{
row.style.display = 'none';
row = getNextSiblingRow(row);
}
else
{
row.style.display = (row.style.display == 'none') ? 'block' : 'none';
row = getNextSiblingRow(row);
}
}while(row &amp;&amp; row.className &gt; classCompare)
}
×

Success!

Help @kloon_za spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.29,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...