chrischen Posted February 18, 2008 Share Posted February 18, 2008 I use this code to load external html files into a div [pre]function ahah(url, target) { document.getElementById(target).innerHTML = '<div style="text-align:center;filter:alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity: 0.5;opacity: 0.5; "><img src="/images/loading.gif" /></div>'; if (window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } if (req != undefined) { req.onreadystatechange = function() {ahahDone(url, target);}; req.open("GET", url, true); req.send(""); } } function ahahDone(url, target) { if (req.readyState == 4) { // only if req is "loaded" if (req.status == 200) { // only if "OK" document.getElementById(target).innerHTML = req.responseText; } else { document.getElementById(target).innerHTML=" AHAH Error:\n"+ req.status + "\n" +req.statusText; } } } function load(name, div) { ahah(name,div); return false; }[/pre] But I i'm trying to load two different files into two different divs on the same page. So I call <body onload="load('file.php','div1');load('file2.php','div2');"> but the first call doesn't load. I know using the javscript code above twice and naming the functions differently the second time makes it work, but how do I modify the code so that I don't have to repeat that stuff twice? Thanks. Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/ Share on other sites More sharing options...
nogray Posted February 19, 2008 Share Posted February 19, 2008 Your second request override your first request. Your req variable must be a local variable in the function, try to add a var infront of it if (window.XMLHttpRequest) { var req = new XMLHttpRequest(); } else if (window.ActiveXObject) { var req = new ActiveXObject("Microsoft.XMLHTTP"); } hope that's work. Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/#findComment-470805 Share on other sites More sharing options...
duclet Posted February 19, 2008 Share Posted February 19, 2008 I have always and will continue to point people to http://prototypejs.org for this type of AJAX need. Download it and read the tutorial on it. It is much easier to do and maintain. Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/#findComment-470815 Share on other sites More sharing options...
chrischen Posted February 21, 2008 Author Share Posted February 21, 2008 I added var in front of those two but it just stops working. Regarding prototype.js, will that slow down the loading of my site? it's 100 Kb. Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/#findComment-472524 Share on other sites More sharing options...
duclet Posted February 21, 2008 Share Posted February 21, 2008 Based on my own experience, it hasn't slowed down my site at all. However, you can gzip compress it if you want since most browsers now can uncompress it when the right header is sent. Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/#findComment-472798 Share on other sites More sharing options...
chrischen Posted February 21, 2008 Author Share Posted February 21, 2008 Well right now actually the above code works fine if I make single calls but do I really need that whole thing just for loading html pages without refreshing? Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/#findComment-472912 Share on other sites More sharing options...
duclet Posted February 21, 2008 Share Posted February 21, 2008 If the code works and you don't have any or plan to code any further JavaScript stuff, then there is no need. Link to comment https://forums.phpfreaks.com/topic/91786-ajax-load-external-html-into-div/#findComment-473015 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.