Switch Conent II - ccollect[...].style is null or not an object

[chrismcb6]

Script Switch Content II:
http://www.dynamicdrive.com/dynamici...chcontent2.htm

Hi there,

First of all, I'd like to say thanks and great job for the Switch Content II script, it does everything I want (almost!).

Only thing it doesnt do is save the state of the expanded/collapsed sections of the page and gives a JS error in IE:

Line: 54
Char: 2
Error: 'ccollect[...].style' is null or not an object
Code: 0


Similarly, it gives this error in the Firefox Javascript console:
ccollect[inc] has no properties

This error is coming from this section of code:

function revivestatus(){
	var inc=0
	while (statecollect[inc]){
		if (ccollect[inc].style.display=="none")
			statecollect[inc].src=expandsymbol
		else
			statecollect[inc].src=contractsymbol
		inc++
	}
}

from the line:

if (ccollect[inc].style.display=="none")

I have other JS running on the same page, but have disabled them to test this error.

The script has been copied exactly from the source, all that has been changed is the image locations.

The JS has been linked to an external .js file and the rest of the script works fine.


I have went through the forums to try to find a solution, but couldn't find one.


The script is running on the following site:

http://www.jcpompoms.co.uk/newSite/


Any help would be appreciated.


Thanks,

Chris

[jscheuer1]

You have a different number of elements (9) with the class of 'showstate' than ones (7) with the class of 'switchcontent'. As this function:

function revivestatus(){
var inc=0
while (statecollect[inc]){
	if (ccollect[inc].style.display=="none")
	statecollect[inc].src=expandsymbol
	else
	statecollect[inc].src=contractsymbol
	inc++
}
}

does its work, it runs out of ccollects (the switchcontent class) before it is done with the statecollects (the showstate class)

For persistence to work, you need to first turn it on (in the configuration area of script, near the top):

var enablepersist="on" //Enable saving state of content structure using session cookies? (on/off)

And, you need to replace this:

<!-- News -->
                                <table class="indexTableContent" width="100%" border="0" cellspacing="0" cellpadding="0">
                                  <tr>

                                    <td class="headers"><img src="../newSite/images/minus.png" alt="Expand/Collapse" class="showstate" onclick="expandcontent(this, 'news')" />News</td>
                                  </tr>
                                  <tr>
                                    <td id="news" class="switchcontent" valign="top">
										 <table width="100%" border="0" cellspacing="0" cellpadding="2" style="margin-bottom:5px"> 	<tr> 	  <td class="newsHeader"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>News Feature</td><td align="right">06/06/06</td><td width="20px"><img src="../newSite/images/minus.png" alt="Expand/Collapse" class="showstate" onclick="expandcontent(this, 'number3')" /></td></tr></table></td> 	</tr> 	<tr> 	  <td id="number3" class="newsContent">This is where the news will now be displayed. Updated by Gillian or Joanne.</td> 	</tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="2" style="margin-bottom:5px"> 	<tr> 	  <td class="newsHeader"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>New Site</td><td align="right">04/05/06</td><td width="20px"><img src="../newSite/images/minus.png" alt="Expand/Collapse" class="showstate" onclick="expandcontent(this, 'number1')" /></td></tr></table></td> 	</tr> 	<tr> 	  <td id="number1" class="newsContent">Welcome to the new JC PomPoms site. Have a look around n tell us what you think.</td> 	</tr> </table>									</td>

                                  </tr>
                                </table>
                              <!-- News -->

with:

<!-- News -->
                                <table class="indexTableContent" width="100%" border="0" cellspacing="0" cellpadding="0">
                                  <tr>

                                    <td class="headers"><img src="../newSite/images/minus.png" alt="Expand/Collapse" class="showstate" onclick="expandcontent(this, 'news')" />News</td>
                                  </tr>
                                  <tr>
                                    <td id="news" class="switchcontent" valign="top">
										 <table width="100%" border="0" cellspacing="0" cellpadding="2" style="margin-bottom:5px"> 	<tr> 	  <td class="headers"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>News Feature</td><td align="right">06/06/06</td><td width="20px"><img src="../newSite/images/minus.png" alt="Expand/Collapse" class="showstate" onclick="expandcontent(this, 'number3')" /></td></tr></table></td> 	</tr> 	<tr> 	  <td id="number3" class="switchcontent">This is where the news will now be displayed. Updated by Gillian or Joanne.</td> 	</tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="2" style="margin-bottom:5px"> 	<tr> 	  <td class="headers"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>New Site</td><td align="right">04/05/06</td><td width="20px"><img src="../newSite/images/minus.png" alt="Expand/Collapse" class="showstate" onclick="expandcontent(this, 'number1')" /></td></tr></table></td> 	</tr> 	<tr> 	  <td id="number1" class="switchcontent">Welcome to the new JC PomPoms site. Have a look around n tell us what you think.</td> 	</tr> </table>									</td>

                                  </tr>
                                </table>
                              <!-- News -->

[chrismcb6]

Thanks very much John.

I don't know how that got passed me! The code was generated from a PHP mySQL link and would have kept repeating itself.

Had a few other bugs with multiple JS files and variable names, but they're all sorted now and the script works as it should.



Thanks Again.


Chris