Dynamic Ajax Content DIV rightcollumn name problem

[slalex]

1) Script Title: Dynamic Ajax Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm

3) Describe problem:

Hi,
Last week I found the above mentioned script at this site.
To be honest it is actually what I am looking for, for more than a year almost.

So now I am a bit playing around with the demo file, with the cars etc etc.
Trying to add some useless functions and and removing them again and trying to alter it a bit and see what it does.

But now I have ran into a very strange "problem".


<div id="rightcolumn"><h3>Choose a page to load.</h3></div>

When I alter the id "rightcolumn" into something else such as: justabike

<div id="justabike"><h3>Choose a page to load.</h3></div>

Of course I altered the links as wel.


<a href="javascript:ajaxpage('ajaxfiles/external2.htm', 'justabike');">Ferrari Page</a>
<a href="javascript:ajaxpage('ajaxfiles/external3.htm', 'justabike');">Aston Martin Page</a>

And the CSS code.
The loading of the content in the justabike layer works fine.
However the CSS won't load for some reason.

I have looked all over the .js files if there was any pre-defined ID for the location where the CSS should pop up but it looked all dynamically.

So I am a bit confused now?
Does anyone know what I could have overlooked?

Thanks in advance.

[ddadmin]

Do you mean "CSS" that appears inside the external files (ie: external2.htm or external3.htm)? Did you remember to also call the function loadobjs() to load any CSS files? For example:


<a href="javascript:ajaxpage('test.htm', 'contentarea'); loadobjs('external.css')">test</a>

[slalex]

Yes I did.


<div id="leftcolumn">
<a href="javascript:ajaxpage('ajaxfiles/external.htm', 'rightcolumn'); loadobjs('ajaxfiles/style.css', 'ajaxfiles/tooltip.js');">Porsche Page</a>
<a href="javascript:ajaxpage('ajaxfiles/external2.htm', 'rightcolumn');">Ferrari Page</a>
<a href="javascript:ajaxpage('ajaxfiles/external3.htm', 'rightcolumn');">Aston Martin Page</a>

<div style="margin-top: 2em">Load CSS & JS files</div>
<a href="javascript:loadobjs('ajaxfiles/style.css', 'ajaxfiles/tooltip.js');">Load "style.css" and "tooltip.js"</a>
<a href="javascript:loadobjs('ajaxfiles/style.css');">Load "style.css"</a>

</div>

<div id="rightcolumn"><h3>Choose a page to load.</h3></div>
<div style="clear: left; margin-bottom: 1em"></div>

The above works fine.
However asap as I change the rightcolumn name into something else as I mentioned above it quits working. :confused:

[ddadmin]

However asap as I change the rightcolumn name into something else as I mentioned above it quits working.

I can't think of any reason why this would happen, except if "tooltip.js" is perhaps hard coding the reference to the rightcolumn's name. Check inside all your externally loaded files whether this is the case.