Cara Install Plugin Jquery JqGrid Demo Di Localhost

Pada kesempatan kali ini saya akan menjelaskan bagaimana Cara Install Plugin Jquery JqGrid Demo Di Localhost. Sebelum saya membahas lebih jauh ada baiknya teman-teman tahu terlebih dahulu apa itu JqGrid ?
Jqgrid adalah plugin dari framework Jquery yang digunakan untuk manipulasi data. Di sini Jqgrid memiliki fungsi antara lain untuk load data, edit delete, search dan masih banyak lagi. Apabila teman-teman biasa menampilkan data ke dalam bentuk tabel biasa, jika menggunakan Jqgrid data tersebut akan tampil menjadi lebih menarik dan dinamis.

Berikut tahapan instalasi nya:

• Pada contoh di sini saya menggunakan web server xampp.
• Telebih dahulu teman-teman download terlebih dahulu file demo jqgrid, dan untuk contoh disini saya menggunakan versi 3.6 yang bisa didownload di situs resmi nya atau dapat download di sini www.4shared.com/zip/Xi05bggEca/jqgrid-v36.html (password zip: brianabraham)
• Jika sudah di download kemudian extrak file zip tersebut ke dalam root folder htdocs teman-teman, nanti akan ada folder dengan nama jqgrid-v.3.6 .

• Buat database baru melalui phpmyadmin dengan nama sesuai keigninan teman-teman, namun pada contoh di sini saya membuat database dengan nama jqgrid-brian.
• Jika sudah, import file database.sql yang ada di dalam folder jqgrid-v.3.6 ke database yang baru saja di buat, seperti gambar di bawah ini:

• Selanjutnya teman-teman bisa langsung melakukan perubahan konfigurasi koneksi file dbconfig.php, yang ada di dalam folder jqgrid-v.3.6. disini teman-teman dapat sesuaikan dengan settingan database yang baru di buat seperti contoh berikut:

• Save, buka browser dan ketikan alamat seperti berikut: http://localhost/jqrid/jqgrid.html , maka akan tampil seperti gambar di bawah:

• Dari tampilan tersebut, terlihat menu di samping kiri tidak tampil, ini di sebabkan karena file jquery-ui-1.7.2.custom.min.js tidak ada, dan di dalam folder tersebut hanya ada file jquery-ui-1.7.1.custom.min.js ,versi di bawah nya dari 1.7.2 yang sudah di sediakan dari jqgrid.
• Untuk memperbaikinya buka file jqgrid.html yang ada di dalam folder jqgrid-v.3.6 dengan editor masing-masing. Lihat pada line atau baris ke 41 yang terdapat kode seperti berikut:

• Ubah dengan kode seperti berikut:

• Teman-teman bisa kembali lagi ke browser dan ketikan ulang alamat berikut: http://localhost/jqrid/jqgrid.html, maka akan tampil seperi gambar di bawah ini:

Sampai di sini penjelasan saya Cara Install Plugin Jquery JqGrid Demo Di Localhost. Semoga bermanfaat.