PDA

View Full Version : AJAX Callback problem



bjkirkham
07-26-2010, 11:45 AM
1) Script Title: Dynamic Ajax Content

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

3) Describe problem: I'm using this script on my site and then using ColourBox to display a gallery however when the links are clicked on the loaded page they don't show the ColourBox effect they simply load in the same window.

However when I load the page on it's own it works fine, spoke to the tech guys who wrote it and they have said I should use the Callback function in the AJAX code, thought that this was the

loadobjs() but this didn't change anything.

Please any ideas would be really helpful I'#ve been going round in circles for 2 days now!!!!

the site is here www.tufcoat.co.uk/2010 and the code is implemented on the products tab>construction grade

Barry

jscheuer1
07-26-2010, 02:48 PM
The loadobjs() thing is a red herring, don't use it. The scripts and styles you need should already be on the 'top' page (the one at http://www.tufcoat.co.uk/2010/). You already have jQuery there (though you may want to upgrade it to v1.4.2), so just add the colorbox.js (after jQuery) and the colorbox.css. Just make sure that the paths to them are correct for that page. The 'callback function' in this case is (in the main Ajax Content script):


function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText
}

And what they told you is correct. If you follow javascript at all, what the above function does is load the result of the request into the contentarea division (or to whatever division you have designated as the contentarea division). You can add to the function:


function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1)){
document.getElementById(containerid).innerHTML=page_request.responseText
some code here to init the imported color box stuff
}
}

Notice the two added red braces. Just what that code would be depends upon what's available in Color Box and how you are using it. I'm guessing (from looking at the source code of your construction_grade.html page & reading over the Color Box docs a bit) that you could replace the green line with:


$("a[rel='tufcoat_product']").colorbox();

In this particular case I don't think it matters that often there will be no a[rel='tufcoat_product], because Color Box should gracefully do nothing in cases like that.

bjkirkham
07-26-2010, 03:52 PM
Worked perfectly, thank you very much!