Tag Archives: Jquery

Autocomplete dengan typeahead.js dan bootstrap

Prolog:

Rasanya sudah lama sekali tidak menulis di blog ini, entah karena sibuk beneran atau sibuk yang dibuat-buat. Akhirnya nemu juga bahan buat ditulis lagi dan waktu untuk menulis

Autocomplete adalah salah satu fitur yang sering dipakai ketika kita membuat sebuah aplikasi berbasis web. Dibandingkan dengan menggunakan select / dropdown biasa untuk memilih item, menggunakan autocomplete adalah pilihan yang tepat menurut saya, dikarenakan apabila menggunakan dropdown dan daftarnya sudah sangat panjang, akan sedikit menyulitkan untuk memilih item dari dropdown tersebut.

Sebelumnya saya sudah pernah menulis tentang autocomplete menggunakan jquery-ui dan ternyata sudah 5 tahun berlalu dari tulisan tersebut. Karena sekarang tren yang sedang berkembang dikalangan front-end web developer adalah menggunakan bootstrap, kita akan coba terapkan itu dalam fitur autoomplee ini. Dan twitter, selain mengembangkan bootstrap juga membuat sebuah library untuk fitur autocomplete ini, dengan nama typeahead.js Continue reading

Create Chart using Codeginter, JQuery and Google Chart Tools

 

Google, selain sebagai mesin pencari yang handal, juga berperan besar dalam teknologi Open Source. Selain OS Android nya, google juga menyediakan berbagai layanan yang sangat berguna bagi para developer. Misalnya saja appengine,  Google Libraries, GWT, dan sebagainya. Salah satu yang saya gunakan adalah Google Charts Tools, yaitu library Javascript yang dapat digunakan untuk merender / membangun grafik. Karena merupakan library javascript, maka dapat dipadukan dengan berbagai bahasa pemrograman, dalam hal ini yang akan saya contohkan adalah PHP yang dipadukan dengan Codeigniter dan JQuery. Sebenarnya, dari halaman Google Chart Tools itu sendiri sudah menyediakan tutorial dasar penggunaaan nya, bahkan sangat lengkap.

Berikut penerapan google chart tools dengan Codeigniter dan Jquery

Continue reading

Set Specific row style in jqgrid

Mengatur style untuk baris pada jqgrid (Bahasa Indonesianya gitu..)

Permasalahan ini saya temui ketika akan membuat tabel dengan Jqgrid, kemudian ada pengelompokan baris tertentu. Misalnya ketika pada field “Status” ternyata masih kosong, maka baris tersebut akan berwarna merah (tugas dari temen sih sebenernya :P). Kalo misal table yang dibuat bukan dari plugin JQgrid mungkin tidak terlalu ribet, apalagi dokumentasi JQgrid sangat minim menurut saya.Dan juga desain table yang saya gunakan tidak setandar!!! hah, gimana ini..

Setelah browsing dan disambi twitteran, serta google plus-an (halah) dan tidak lupa ngaskus..akhirnya nemu inspirasi juga.. Continue reading

Insert Multiple Rows dynamically with Jquery, PHP and MySQL

Jquery
udulnya mbois browww….

Begini ceritanya.pernah suatu ketika saya dikasih tugas di tempat kerja saya yang dulu, untuk membuat aplikasi web. Nah pada aplikasi tersebut terdapat fungsi memasukkan data tetapi secara dinamis (ga satu persatu). Yang dimaksudkan dinamis adalah, kita bisa menambahkan baris dengan sebuah tombol, jadi setiap tombol tersebut di klik, maka akan muncul 1 baris baru di bawahnya untuk menampilkan field inputan. Kalo masih belum mudeng, bisa di lihat di halaman DEMO.

Nah dulu sih, ada contohnya, buatnya pake DOM Javascript, karena fieldnya banyak, maka scriptnya jadi spagetti alias amburadul.. Susah dipelajari, mana yang child, mana yang parent. Ternyata eh ternyata, setelah belajar pake jquery, jquery memiliki fungsi .append() yang bisa digunakan untuk ini.
Continue reading

Mengaktifkan fitur search, sort dan paging pada JQrid dan Codeigniter

Sebelumnya saya mohon maaf, jika pada artikel sebelumnya Tutorial menggunakan Codeigniter dan JqGrid ternyata masih banyak terdapat kesalahan pada codingnya :D. Misalnya fungsi sorting dan search belum bisa jalan, kemudia fungsi pagination juga masih eror :((.

Kali ini saya berusaha memperbaiki kesalahan tersebut, dengan mengaktifkan fitur search, sorting dan paging pada jqgrid tersebut.
Continue reading