Sabtu Pahing 11 Oktober 2008 23:02

learn make rich

share make it perfect

Ayat Suci

Dirikanlah shalat dari sesudah matahari tergelincir sampai gelap malam dan (dirikanlah pula shalat) subuh. Sesungguhnya shalat subuh itu disaksikan (oleh malaikat).
(QS. AL ISRA:78)

otomatis refresh

Javascript ayat

Proyek Saat Ini

Aplikasi SMS
Download aplikasi dan source

SMS Autorespond (VB)

Para Rekan

FlazX.com - Your Computer & IT Learning Center & eBook Directory

Link Exchange

Lain-lain

User online: 475
User login: 1

user/passwd: bpuser

Autocomplete Pada Form

Contoh script berikut ini menampilkan cara mengisi value field suatu form, tanpa harus melakukan submit data

Aryo Sanjaya

Rabu Pahing, 5 April 2006

Hampir sama dengan artikel Merubah Isi Combobox, artikel ini menerapkan AJAX sebagai teknik untuk memanipulasi tampilan. Yang membedakan adalah, teknik ini menggunakan XML sebagai format data kembalian dari script PHP, dikarenakan jumlah data yang lebih banyak.

Simpan file ini dengan nama tesautocomplete.html:

<html> <head> <title>Tes Autocomplete</title> </head> <body> <script type='text/javascript'> function createRequestObject() { var ro; var browser = navigator.appName; if(browser == "Microsoft Internet Explorer"){ ro = new ActiveXObject("Microsoft.XMLHTTP"); }else{ ro = new XMLHttpRequest(); } return ro; } var xmlhttp = createRequestObject(); function cari(teks) { var kode = teks.value; if (!kode) return; xmlhttp.open('get', 'getdata.php?kode='+kode, true); xmlhttp.onreadystatechange = function() { if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200)) { var r = xmlhttp.responseXML.getElementsByTagName('data'); document.getElementById("nama").value = r[1].firstChild.data; document.getElementById("harga").value = r[2].firstChild.data; } return false; } xmlhttp.send(null); } </script> <form> Kode: <input type="text" onchange="javascript:cari(this)"/><br/> Nama Barang : <input type="text" id="nama" /><br/> Harga : <input type="text" id="harga" /><br/> </form> </body> </html>

File PHP, simpan dengan nama getdata.php:

<?php $kode = $_GET['kode']; $nama = ""; $harga = ""; if ($kode == "1") { $nama = "satu"; $harga = "1000"; } else if ($kode == "2") { $nama = "dua"; $harga = "2000"; } else { $nama = "tidak ketemu"; $harga = "0"; } header("content-type: text/xml"); echo " <xmlresponse> <data>$kode</data> <data>$nama</data> <data>$harga</data> </xmlresponse> "; ?>

Pada script utama (tesautocomplete.html), yang dilakukan adalah:

melihat perubahan pada textbox kode
jika kode dirubah (event onchange), maka fungsi cari( ) akan dijalankan
pada fungsi cari, diambil value dari kode yang diketikkan
mem-fetch script getdata.php dengan parameter kode sesuai value yang dipilih
user menunggu output dari getdata.php
script ambildata.php dijalankan, dan memproses kode yang diberikan
memberikan output sesuai dengan hasil proses
output diterima oleh javascript
data yang diterima, diparsing sesuai dengan tag "data"
masing-masing data ditampilkan pada field yang bersangkutan

Untuk mencoba script di atas, silakan masuk Tes Autocomplete.

Selamat coding :)

Kirim via Email :: Tampilkan Versi Cetak

Komentar

Halaman Komentar: < 1 2

pur

strike_set@...

Jum'at Pahing, 9 Februari 2007

webnya "ANEH" BANGET, saya jadi pusing kalo bikin web ya, yang memudahkan pengguna donk kalo mau, saya bikinin TA??? boleh kok, langsung aja kontak e-Mail saya OK Daaaaaaaaaa..........Ch

guss kadek

songan_gati@...

Kamis Kliwon, 20 September 2007

wah artikelnya baguss.. saya mau nanya dikid... gimana kalo pengembalian nilai dalam bentuk perulangan...yang di masukkan ke list misal: 1. memamaki list box....JIKA Kita klick listnya misal --> kita klick Indonesia...akan muncul di kotak list selanjutnya nama propensi seluruh indonesia.... 2. memamaki list box....JIKA Kita mau masukkan indonesia..kita ketik I..akan otomatis mencari list negara nama I..kemudian ketik N..lebih spesipik mencari negara yang ada IN nya..dan seterusnya samapi kata INDONESIA kOMPLET... listnya misal<<-----semua action itu masih di list pertama nah kemudian setelah di masukkan indonesia akan muncul di kotak list selanjutnya nama propensi seluruh indonesia.... terima kasih atas bantuannya....maap..saya bingng dengan kondisi perulangan..soalnya saya memakai..patTemplate anggine..untuk desain WEBnya.... mohon bimbingan karena masih buta ...trims....

van n

uut_van_n@...

Senin Pahing, 14 April 2008

keren pak,.. aku udah cari ke ujung dunia.. ternyata ketemunya di situsnya pak parjo,.. buat yang suka bikin spam,.. jangan gunakan ilmu kamu seperti itu dungk,.. coba aja di wesite porno atu sejenisnya

doez

wedhuskambing@...

Rabu Kliwon, 16 Juli 2008

thank's

c0_iseng

didan_secret@...

Rabu Wage, 30 Juli 2008

kasus nya sama kaya bang ali nih... gimana solusi nya kalo ambil data ny dari database

Halaman Komentar: < 1 2

Mengisi Komentar

Daftar Artikel PHP

» Constructors dan Destructors di PHP (0)

Rabu Pon, 30 April 2008

Constructors sebuah methode yg dijalakan ketika sebuah object dibuat dari sebuah class sedangkan Destructors adalah methode untuk menghapus object ketika script/program berakhir.

» GRABBING KURS BANK BCA (7)

Jum'at Pahing, 20 April 2007

TERINSPIRASI DARI GRABBING KURS BI BANG ARYO

» OOP Pada PHP (Part 1) (23)

Senin Pon, 18 September 2006

Pembahasan mengenai dasar pemrograman OOP pada PHP

(Rakhmad Maulidi)

» Menghitung Jarak Waktu (33)

Rabu Wage, 17 Mei 2006

Mengitung jarak waktu dan menampilkan sebagai Javascript

» Grabbing Kurs Dari BI (20)

Rabu Pahing, 5 April 2006

Grabbing data adalah tindakan tidak sopan. Tapi kali ini yang dibahas adalah teknik grabbing, masalah moral dan etika silakan cari sendiri (inspired by Iwan Fals)

Halaman: 1 2 3 >

Pencarian Situs

Account Data

Anda belum login.