Dynamic page load not working (AJAX) - CSS-Tricks

This topic is empty.

Viewing 2 posts - 1 through 2 (of 2 total)

Author

Posts
August 11, 2010 at 6:39 pm #29884

yupimrich
Member

Hey guys.

I am looking to Ajax up my website in order to keep a song rolling in the footer as users click around the site. I am a total NOOB when it comes to javascript/ajax and I need some help.

I have watched Chris’s screencast on how he does this and have tried to implement the code on my site, but the navigation just isn’t working with this code in place. This would be a huge first step toward having the site done to have this navigation working correctly. Any help at all would mean a lot to me.

the site: simplyrichdesign.com/testsounds

Thanks

Mike

August 12, 2010 at 11:04 pm #81470

evalauren
Member

My teaches suggest me for that try this one
<head>
<script type="text/javascript">
//defining the request
var pageRequest = false //variable to hold ajax object
/*@cc_on
@if (@_jscript_version >= 5)
try {
pageRequest = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try {
pageRequest = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e2){
pageRequest = false
}
}
@end
@*/
if (!pageRequest && typeof XMLHttpRequest != ‘undefined’)
pageRequest = new XMLHttpRequest()

function include(content,id){
var newdiv = document.createElement("div");
newdiv.innerHTML = content;
remove(id); document.getElementById(id).appendChild(newdiv);
}

function remove(id)
{
while(document.getElementById(id).firstChild)
{document.getElementById(id).removeChild(document.getElementById(id).firstChild);}
}

if (pageRequest){

// add as many requests as you want; the variables holding them must be document.written in order to bring in external CODE
pageRequest.open(‘GET’, ‘external1.html’, false)
pageRequest.send(null); ajax_include1=pageRequest.responseText;

pageRequest.open(‘GET’, ‘external2.html’, false)
pageRequest.send(null); ajax_include2=pageRequest.responseText;

//needed for bringing in the external CODE
document.write(‘<div style="display:none">’);
document.write(ajax_include1+ajax_include2);
document.write(‘</div>’);
}

</script>

</head>

<body >
<a href="javascript:void(0)" onclick=’include(ajax_include1,"div1");’>add external1.html</a><br>
<a href="javascript:void(0)" onclick=’include(ajax_include2,"div2");’>add external2.html</a><br><br>
<a href="javascript:void(0)" onclick=’remove("div1")’>remove external1.html</a><br>
<a href="javascript:void(0)" onclick=’remove("div2")’>remove external2.html</a><br>
<div id="div1" ></div>
<div id="div2" ></div>
</body>
Author

Posts

Viewing 2 posts - 1 through 2 (of 2 total)

The forum ‘JavaScript’ is closed to new topics and replies.