Ajax Script – Loading Content

var namavar = false;
try{
namavar = new ActiveXObject("msxml2.XMLHTTP");
} catch (e){
try {
namavar = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (E){
namavar = false;
}
}
//test web browser doeloe
if(!namavar && typeof XMLHttpRequest != 'undefined'){
namavar = new XMLHttpRequest();
}
function tampilkan(serverPage, objID){
var obj = document.getElementById(objID);
namavar.open("GET", serverPage);
namavar.onreadystatechange= function(){
if(namavar.readyState==4 && namavar.status==200){
obj.innerHTML= namavar.responseText;
}		
}
namavar.send(null);
}

Cara menggunakan script diatas cukup mudah.- Simpan script di atas dengan nama ajax.js- Buatlah halaman index.- Tuliskan script berikut :
<html>
<head>
<script language=”javascript” src=”ajax.js”></script>
<title>Belajar Ajax – Loading Content</title>
</head>
<body>

<div id=”tampil”> Copyright Ilmucerdas.wordpress.com </div>
<div id=”linklink”>
<a href=”profil.html” onClick=”tampilkan(‘profil.html’,’tampil’);return false;”>link ke halaman profil.html</a>
</br>
<a href=”agenda.html” onClick=”tampilkan(‘agenda.html’,’tampil’);return false;”>link ke halaman agenda.html</a>
</div>
</body>
</html>

Jika salah satu link di klik, maka sintag div yang memuat tulisan “Copyright Ilmucerdas.wordpress.com” akan berubah menjadi isi halaman yang anda minta tanpa melakukan proses loading server.

Rekomendasi buku : Beginning ajax with PHP from Novice to Professional ~ Lee Babin

Selamat mencoba.
Semoga bermanfa’at.

About Iin aryani

I don't wanna be a "Copycat" but, something they need to copy.

Posted on 11 July 2011, in Website. Bookmark the permalink. 2 Comments.

  1. seperti konsep ajax yah? *hmm

Komentar untuk penulis

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: