pemrograman webelearning.amikom.ac.id/index.php/download/materi/190302150-st084...pemrograman web...

13
Pemrograman Web AJAX ARIF DWI LAKSITO, M.KOM

Upload: lenguyet

Post on 31-Mar-2019

233 views

Category:

Documents


1 download

TRANSCRIPT

Pemrograman WebAJAXARIF DWI LAKSITO, M.KOM

Pengertian AJAX memiliki kepanjangan Asynchronous Javascript And XML,

Merupakan suatu teknik baru dalam dunia web, tetapi masih menggunakan teknologi yang ada sebelumny, yaitu Javascript dan XML

AJAX adalah suatu cara melakukan pertukaran data dari client ke server di halaman web tanpamelakukan refresh halaman tersebut.

Contoh penggunaan AJAX di Google Mail, Facebook, Twitter

Cara Kerja

Teknologi XMLHttpRequest object (to exchange data asynchronously with a server)

JavaScript/DOM (to display/interact with the information)

CSS (to style the data)

XML (often used as the format for transferring data)

XMLHttpRequest Object Object yang digunakan untuk pertukaran data dengan server.

Object yang memungkinkan pertukaran data tanpa melakukan reload halaman

Cara mendefinisikan Object tersebut: variable=new XMLHttpRequest(); Browser selain IE5 + IE6

variable=new ActiveXObject("Microsoft.XMLHTTP"); Browser IE5 + IE6

Code XMLHttpRequest

Send Request Untuk mengirim data digunakan fungsi open() dan send()

Dapat menggunakan model POST atau GET

Async = True vs Async = False Proses send() dapat menggunakan opsi Async = True atau Async = False.

ditambahkan pada parameter ke-3 fungsi open()

Untuk Async = True berarti pada saat proses dan masih menunggu response dari server makadapat mengerjakan yang lain.

Untuk Async = False berarti saat proses dan masih menunggu response dari server tidak dapatmengerjakan proses yang lain, harus menunggu sampai proses selesai.

Server Response Terdapat 2 response yang dikirim dari server: Response text

Response XML

Untuk response text dapat langsung diterima dengan caradocument.getElementById("myDiv").innerHTML=xmlhttp.responseText;

Dan untuk response xmlxmlDoc=xmlhttp.responseXML;txt="";x=xmlDoc.getElementsByTagName("ARTIST");for (i=0;i<x.length;i++){txt=txt + x[i].childNodes[0].nodeValue + "<br>";}

document.getElementById("myDiv").innerHTML=txt;

OnReadyStateChange Event Saat dilakukan pengiriman ke server, kita dapat melihat status dan state yang sedang berjalan

menggunakan property .readystate dan .status

Terima Kasih