Membungkus CJuiAutoComplete Menjadi Widget di Yii

Setelah sekian lama terbengkalai, akhirnya saya melanjutkan postingan ini. Di postingan tersebut (dan postingan-postingan sebelumnya), saya menulis tentang bagaimana mengkustomisasi CJuiAutoComplete sesuai dengan kebutuhan. Tapi kelemahan dari implementasi sebelum-sebelumnya adalahautocompletetersebut terikat pada satucontroller dan agak repot untuk dipakai diview yang lain.

Agar dapat dengan mudah digunakan di view yang lain solusinya adalah dengan membungkus autocomplete tersebut menjadi sebuah Widget. Dengan demikian, untuk menggunakan autocomplete, kita cukup meletakkan kode widgetnya saja. Permasalahan dengan Widget ini adalah bagaimana cara mendapatkan data untuk autocomplete tersebut? Caranya mudah, yakni dengan menggunakan fitur ActionProvider pada Widget.

Menggunakan CJuiAutoComplete di Yii – Menambahkan Link Di Dropdown

Sesuai dengan permintaan di postingan sebelumnya, sekarang saya akan mencoba menambahkan link di dropdown yang dihasilkan oleh autocomplete. Seperti autocomplete yang ada di Facebook, autocomplete yang akan saya modifikasi akan memindahkan halaman ke halaman profil userketika dropdownnya diklik.

Menggunakan CJuiAutoComplete di Yii – Autocomplete Sederhana

Untuk memenuhi permintaan dari Jupri yang atas permintaan di bagian Request yang meminta tutorial bagaimana cara membuatautocomplete”seperti facebook”.

Autocomplete textfield adalah sebuah textfield yang ketika diberikan input sebuah string maka textfield itu akan menampilkan beberapa hasil rekomendasi. Contoh yang sering terlihat adalah autocomplete di Facebook search ataupunsearch suggestiondi Google Search.

Contoh penggunaan autocomplete untuk Facebook search.

Di Yii sendiri sudah ada komponen bawaan yang mendukung pembuatan fitur autocomplete seperti ini. Komponen ini adalah CJuiAutoComplete (sebelumnya sudah ada CAutoComplete yang kemudian dihentikan pengembangannya). Komponen CJuiAutoComplete tidak lain merupakan pembungkus dari widget jQuery UI – Autocomplete. Kematangan widget ini membuat pengembang Yii menghentikan komponen CAutoComplete dan beralih menggunakan jQuery UI.