Update div content
From D3xt3r01.tk
Jump to navigationJump to search
Source
<script type="text/javascript">
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;
}
}
function ajaxpage(url, containerid){
var page_request = false;
if(window.XMLHttpRequest){
page_request = new XMLHttpRequest()
}else if(window.ActiveXObject){
try{
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}catch (e){}
}
}else{
return false;
}
page_request.onreadystatechange = function(){
loadpage(page_request, containerid)
}
page_request.open('GET', url, true)
page_request.send(null)
}
</script>How
It creates a new request .. updating the div id we provide with the content received from the request ... NEAT !
Example
Assuming we have another file named blahblah.html containing "TADAAA" .. you should see the div updating to TADAAAA ...
<html>
<head><script type="text/javascript">
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;
}
}
function ajaxpage(url, containerid){
var page_request = false;
if(window.XMLHttpRequest){
page_request = new XMLHttpRequest()
}else if(window.ActiveXObject){
try{
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}catch (e){}
}
}else{
return false;
}
page_request.onreadystatechange = function(){
loadpage(page_request, containerid)
}
page_request.open('GET', url, true)
page_request.send(null)
}
</script></head>
<body>
<div id="updatethis">Feel free to leave this empty</div>
<a href="#" onclick="ajaxpage('blahblah.html', 'updatethis');">Update the div...</a>
</body>
</html>