PDA

View Full Version : Dynamic AJAX Content loadobjs help



jsico
05-04-2006, 01:34 AM
Script: Dynamic Ajax Content
http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm (edit - link fixed)

Hi all! This script is awesome - it does something I had been trying to do for days.

However, I am having a hard time getting it to apply the new JS styles (also AJAX) to my new content. My script differs from the examples, in that I removed the javascript from the anchor link, and add the onclick element eternally.

The relevant code is:
el.onclick = function () {ajaxpage(this.href, 'content'); loadobjs('common.js','flashobject.js','domcollapse.js')

To see what I'm working with, the site in question is http://www.superbuick.com.

Thanks for any help!

jscheuer1
05-04-2006, 05:20 AM
The link you supplied back to the DD script in question is, at the moment, broken. You probably cut and pasted it from an earlier version of your message in preview mode, happens sometimes. Please correct this so we can have a look at the script in question.

In the meantime I can observe that with:



el.onclick = function () {ajaxpage(this.href, 'content'); loadobjs('common.js','flashobject.js','domcollapse.js')

I see only one anchor element on your page. If the above code refers to it or some script created anchor element with a defined href attribute, then:

this.href

would be valid. If however, it refers to an input button or anything other than an anchor href tag:


<a href="somepage.htm">link text or image</a>

it would not be valid. Also, if it refers to an anchor href tag with something like:

<a href="javascript:some_function();">

That's no good either.

jsico
05-04-2006, 12:27 PM
Hi, thanks for the response. I have corrected the link.

The code that I posted is actually part of the "Behaviour" js library. All that it does it replace the onclick attribute for the specified anchors, so I don't have to have obtrusive javascript right in my xhtml.

However, I think the problem isn't with the "behaviour" part, since the first onclick (ajaxpage) works as intended. It's the second (the loadobjs function) part where I suspect I'm messing up.

Here's the rest of the code I posted above:

var myrules = {
'a.links' : function(el){
el.onclick = function () {ajaxpage(this.href, 'content'); loadobjs('common.js','flashobject.js','domcollapse.js'); return false;}
}
};

You can see that it gives all "a class="links"" items the onclick.

Thanks again!

edit - I should also mention that I tried this without the added "behaviour" actions, and I just added them right to the link like this:

<a href="javascript:ajaxpage('/shows', 'content'); loadobjs('/js/common.js','/js/flashobject.js','/js/domcollapse.js');" title="Shows" class="links">Shows</a>

With no such luck - still loads the page into the right spot, but doesn't apply the other scripts. It's like that right now at www.superbuick.com if you want to see the code in its native habitat.

jscheuer1
05-04-2006, 06:34 PM
Well, in that case it would seem it has nothing to do with how the command is issued but, rather with the command itself. I notice from the demo page that only scripts and style not already associated with the top or main page are used with the loadobj() function. However, you are loading common.js which is already loaded on the main page. Also you are loading swfobjects.js, which may include many things that are in flashobject.js, that is already loaded on the main page.

Even without these same two scripts (common.js) being loaded, if there were a script conflict between a script loaded by loadobjs() and a script already on the page, that probably would cause a problem. If both versions of common.js where to become active on a page at once, there would most certainly be conflicts. However, I am not 100% certain (99% is more like it) that this is what the effect of loadobjs() is but, since it has no parameter to tell it where to load, I would assume it is loading its objects for the main page, with a trickle down effect to the dynamically added AJAX content which, after all, is simply becoming a part of the main page and has no separate identity of its own once its code is added as the innerHTML of the content division. If I am correct in this assumption (as I most likely am), you should never loadobjs() anything that would conflict with anything on the main page and especially never anything already loaded on the main page.

I'd try using loadobjs() with only a unique stylesheet not used by the main page, just to see if it works that way and has the expected result.