Ada tiga fungsi yang digunakan yaitu :
Fungsi ambil data
Fungsi buat objekxhr
Fungsi untuk menampilkan data
fungsi tampil menggunakan DOM dan innerHTML
untuk lebih jelasnya lihat script berikut ini : (beri nama tranferdata.html)
<html>
<head>
<title>Menampilkan data dari server</title>
<script language=javascript>
//Mendeklarasikan objek XMLHttpRequest
var objekxhr;
function ambildata(){
/*untuk mengambil data dari server
fungsi ini akan dipecah menjadi beberapa fungsi terpisah
*/
buatxhr();
objekxhr.open(“GET”,”data/data.txt”);
objekxhr.send(null);
objekxhr.onreadystatechange=tampilkan;
}
function buatxhr(){
//ini fungsi untuk membuat objek XMLHttpRequest
if (window.activeXObject){
// ini kode untuk membuat objek xhr jika user menggunakan browser IE5 dan IE6
objekxhr = new
activeXObject(“Microsoft.XMLHttp”);
}
else if(window.XMLHttpRequest){
//ini kode untuk membuat objek xhr untuk non IE
objekxhr = new XMLHttpRequest();
}else{
alert(“Segera ganti browser anda browser ini tidak support AJAX”);
}
}
function tampilkan (){
/*ini mengunakan DOM dan innerHTML
mengenai DOM akan dijelaskan pada subBAB berikutnya*/
document.getElementById(“kotak”).innerHTML=objekxhr.responseText;
}
</script>
</head>
<body>
<input type=”button” value=“Klik untuk menampilkan table” onclick=“ambildata();”/>
<div id=“kotak”><!==ini tempat menampilkan teks></div>
</body>
</html>
Script di atas tampilanya sbb :
Kemudian Klik tombol di bawah ini
Tampilannya akan tampak sbb :
Data berhasil di tampilkan, contoh di atas adalah penggunaan teknology Ajax (Asyncrounous Java XML)
isi dari data.txt sbb :
<table border=”2″ bgcolor=”pink”>
<tbdy>
<tr>
<td>Senin</td>
<td>Selasa</td>
<td>Rabu</td>
<td>Kamis</td>
<td>Jum at</td>
</tr>
<tr>
<td>matematika tekni</td>
<td>Fisika dasar</td>
<td>kalkulus</td>
<td>Algoritma pemrograman</td>
<td>C++</td>
</tr>
<tr>
<td>Kimia dasar</td>
<td>Biokimia</td>
<td>Agama</td>
<td>OOP</td>
<td>algoritma Pemrograman 2</td>
</tr>
</tbody>
</table>
terimakasih atas kunjungannya semoga artikle di atas bisa bermanfaat bagi perkembangan dunia TI Di Indonesia
DIarsipkan di bawah: Ajax | Ditandai: Ajax, Java Script, Xml
bagaimana menampilkan data berdasarkan data imputan yang di bandingkan misal ada form nama, alamat, dan jenis kelamin, jika nama dimasukan maka data alamat dan jenis kelamin akan muncul secara real time, terima kasih atas pencerahannya.