Belajar Ajax menggunakan jQuery

Jquery adalah framework javascript yang sedang tren saat ini. Selain dukungan fasilitas yang lengkap, membuat plugin jquery juga cukup mudah. Dukungan ajax adalah salah satu fasilitas yang sudah tersedia di jquery. Jika masih bingung tentang apa itu ajax, bisa melihat artikel berikut ini.

Ok, kita lanjut dengan latihannya.

Latihan ini membutuhkan

1. XAMPP yang telah terinstall
2. JSON Extension di php sudah terpasang. cara mengecek fungsi - fungsi yang telah terpasang dengan kode ini

info.php

<?php

phpinfo();

?>

Firebug sudah diinstall di Firefox. Jika tidak menggunakan firefox, gunakan chrome atau opera. Ini penting untuk mendebug aplikasi ajax

1. buat file php dengan nama data.php , file ini adalah penyedia sumber data.

kode :

Simpan dengan nama data.php

<?php

//siapkan data array
$data = array("nama"=>"Budi","Alamat"=>"Bekasi , Indonesia","Web"=>"http://www.paketkredit.com");

//set header file agar browser mengenali jenis data
header("content-type: Application/json");

//keluarkan data
echo json_encode($data);

?>

Javascript : Pengenalan JSON

Saat ini aplikasi web telah menjadi tren yang terus menerus mengalami perbaikan. Berbagai solusi mulai dari cara koneksi (XMLHTTPRequest) dan Type data (Text,XML,JSON) telah dibuat untuk kemudahan pembuatan aplikasi web. Saya akan berbicara mengenai JSON yang merupakan typedata yang menjadi pilihan majority untuk pengembangan aplikasi web.

JSON, Javascript Object Notation adalah suatu cara penulisan data yang bersifat object oriented dan 100% compatible dengan javascript.

Mengapa Mengunakan JSON ?
1. JSON 100% Javascript compatible , jadi bisa dijalan disetiap browser
2. JSON Memiliki type data, tidak seperti xml
3. JSON Mudah dibaca baik oleh mesin maupun manusia
4. JSON Mudah ditulis/dibuat

PHP : Belajar AJAX dengan bantuan SAJAX

Download Contoh Kode

Saat ini aplikasi web selalu darahkan untuk menggunakan ajax. Dalam artikel ini, kita akan belajar mengimplementasikan ajax dengan menggunakan library bantuan dari modernmethod.com yang bernama sajax.

Kenapa menggunakan ajax

Aplikasi web berjalan halaman demi halaman. misalkan, jika kita ingin menambah data pada sebuah table maka akan melibatkan paling tidak 2 halaman, yaitu :

1. halaman form
2. halaman pemroses.

Apabila tidak ada data yang khusus ingin dimunculkan pada halaman form, maka proses standar menggunakan 2 halaman seperti dapat digunakan. masalah akan muncul apabila ada informasi yang ingin dimunculkan pada saat input data di form. misalkan data yang diinput adalah data order, yang pada saat kode produk diinput maka dihalaman yang sama akan muncul stok dan nama produk yang dmaksud.

Masalah tersebut bisa diatasi dengan 2 cara :
1. menggunakan window.open yang akan membuka window baru
2. menggunakan ajax

Kita hanya akan membicarakan solusi nomor 2 , yaitu ajax. Ajax menggunakan komponen browser yang disebut dengan XMLHttpRequest yang diciptakan pertama kali oleh Microsoft untuk browsernya Internet Explorer. Dengan menggunakan XMLHttpRequest ini ditambah dengan Javascript maka ajax dapat terlaksana .

Berikut ini contoh kode :