www.koder.web.id – Kumpulan tutorial komputer Chapter 13 Kasus 9. <strong>Codeigniter</strong> dan jQuery AutoComplete AutoComplete adalah sebuah fitur dimana kita memberikan saran kepada pengguna mengenai apa yang telah mereka ketikkan di textbox. Jadi user tidak perlu mengetik secara keseluruhan mengenai hal yang ingin dicari. Untuk mendapatkan fitur autocomplete kita dapat menggunakan bantuan javascript terutama jquery. Fitur autocomplete itu sendiri sudah dimiliki oleh plugin jqueryui secara default, sehingga tidak perlu plugin tambahan lagi. Adapun kasus yang cocok untuk menggunakan fitur autocomplete adalah pencarian nama kota. Misalkan kita memiliki database kota dan kita akan menggunakan database tersebut untuk mempermudah penggunna dalam mengisi field kota. Adapun hal-hal yang harus di persiapkan adalah 1. Membuat Tabel Kota dan Konfigurasi Database CodeIgniter Buatlah tabel dan isi nama kota seperti contoh berikut CREATE TABLE IF NOT EXISTS `kota` ( `id_kota` int(11) NOT NULL AUTO_INCREMENT, `nama_kota` varchar(50) NOT NULL, PRIMARY KEY (`id_kota`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=17 ; -- -- Data for table `kota` -- INSERT INTO `kota` (`id_kota`, `nama_kota`) VALUES (1, 'Aceh'), (2, 'Jakarta'), (3, 'Bandung'), (4, 'Cirebon'), (5, 'Dumai'), (6, 'Batam'), (7, 'Tanjung Pinang'), (8, 'Malang'), (9, 'Mataram'), (10, 'Maluku'), (11, 'Marauke'), (12, 'Surabaya'), (13, 'Semarang'), (14, 'Serang'), (15, 'Selatpanjang'), (16, 'Sumbawa'); Tabel d iatas cukup sederhana, kita akan menyimpan id_kota dan namakota sebagai data utama pada tabel tersebut. Selain itu pastikan Anda telah mengkonfigurasi database 111
www.koder.web.id – Kumpulan tutorial komputer 112 <strong>Codeigniter</strong>. Konfigurasi tersebut berada di file application/config/database.php (perhatikan bab sebelumnya jika Anda bermasalah dalam mengkoneksikan database. 2. Membuat Model Tabel Kota Setelah membuat table, hal berikutnya adalah membuat sebuah model yang digunakan untuk mengakses data dari tabel tersebut. Perhatikan model berikut ini: 1.
Change language