AJAX Talk: Simple XML HTTP Request Object Implementation

Ini adalah kesempatan saya yang pertama untuk memberikan sedikit pengenalan kepada anda tentang AJAX(Asynchronous JavaScript and XML). AJAX bukanlah sebuah teknologi, melainkan sebuah teknik yang mendeskripsikan bagaimana JavaScript dapat digunakan untuk mengambil data dari server dengan menggunakan XML HTTP Request Object dan kemudian data tersebut dimasukan kedalam website dengan menggunakan DOM(Document Object Model). Semua ini bekerja secara asinkron(Asynchronous) dan dapat diselesaikan tanpa me-refresh page. AJAX merupakan teknik yang tepat untuk membuat suatu website yang dimanis.

Banyak implementasi dari AJAX ini. Namun kali ini saya akan mulai memperkenalkan AJAX dari Simple XML HTTP Request Object. Sudahkah anda siap untuk menyambut AJAX? Klo sudah mari kita mulai..

1. Starter

Tutorial ini saya buat mengharuskan anda untuk membuat webserver local. Jika anda belum menginstalnya silahkan instal terlebih dahulu. Saya anjurkan anda menggunakan XAMPP. Silahkan lihat tutorialnya disini XAMPP Talk: How to instal XAMPP. Jika sudah menginstal, buatlah folder tutorialajax pada c:\xampp\htdocs. Buatlah juga beberapa file berikut:

  1. index.html digunakan sebagai homepage. Dimana kita akan membuat halaman ini sebagai halaman utama.
  2. requestme.php file ini akan kita gunakan sebagai target file yang akan kita load secara asynchronous ke halaman utama.
  3. jquery.js ini adalah jQuery library yang kita gunakan untuk memberikan sedikit animasi pada website.

2.  Download jQuery Library

Jika anda belum mempunyai jQuery Library, silahkan download disini. Copy semua scriptnya dan paste pada file jquery.js. Jangan lupa untuk menyimpan file tersebut.

3. HTML Coding time

Continue reading