Tentang IT dan Komputer

Teknologi Informasi

Membuat Combobox Dinamis dengan AJAX

Posted by intrik on May 25, 2007

PenulisEko Heri Susanto mengulas penggunaan AJAX dalam ASP untuk membuat combobox yang dinamis

Membuat Combobox Dinamis dengan AJAX
AJAX (Ashynchronous Javascript and XML) sebenarnya adalah konsep lama, tehnik ini sudah ada dari beberapa tahun yang lalu. Dengan sedikit modifikasi maka tehnik ini bisa menjadikan aplikasi web menjadi lebih dinamis dan interaktif seperti layaknya aplikasi desktop.Dengan menggunakan teknologi ini, page HTML bisa membuat koneksi secara asinkron ke server dengan cara mengambil XML dokumen. Selanjutnya dokumen XML ini akan digunakan oleh javascript untuk meng-update atau memodifikasi Document Object Model (DOM) pada page HTML.

Untuk selanjutnya tehnologi ini juga dikenal web remoting atau remote scripting. Developer Web dapat mengkombinasikan plug in, java applets dan hidden frame untuk mengemulasikan interaksi antara page HTML  dengan dokumen XML. Dalam teknologi Javascript telah disediakan sebuah object yaitu XMLHTTPRequest. Object ini sudah banyak disupport oleh banyak browser seperti Internet Explorer, Firefox dan lain sebagainya.

Berikut ini ilustrasi yang menggambarkan interaksi AJAX dengan Server :

[ajax.JPG: klik untuk menampilkan gambar]
Berikut ini contoh script sederhana yang memanfaatkan teknologi AJAX. Contoh script ini sebenarnya terinspirasi dari artikel Mas Aryo yang berjudul Merubah isi combobox dan Autocomplete pada form. Dalam contoh ini saya menampilkan combobox yang berisi data dinamis, yang isinya tergantung pada pilihan user Misalnya saja combobox untuk memilih Nama Kecamatan, maka isi combobox tersebut hanya berisi nama kecamatan yang ada dalam kabupaten yang dipilih. Dalam contoh ini saya menggunakan asp sebagai web server sedangkan database-nya saya menggunakan MS-Access.Untuk mencoba teknik ini, silakan simpan file HTML berikut ini dengan nama testcustomer.htm
script asp:simpan dengan nama koneksi.asp
script asp:simpan dengan nama LoadDataRegional.asp
Contoh selengkapnya silahkan Download di sini Form Customer . Selesai….
Eko Heri Susanto
IT Manager of PT. Catur Putra Jaya,  HONDA Motorcycle Authorized Dealer
Head Office   :  Jl. Raya Perjuangan M17-19, Teluk Pucung, Wisma Asri, Bekasi Utara, Indonesia Telp:021-88966091
Branch Office : Jl. Raya Sawangan KM. 12, No.5 Pancoran Mas, Depok, Indonesia Telp :021-7751300-7751600
Branch Office : Jl. Raya Parung-Bogor KM.15, NO.5, Kemang, Bogor, Indonesia, Telp:0251-7540505
HP: 021-68755105, email:ekoheri@gmail.com

Leave a Reply

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: