Cara memakai Kendo UI (offline)

SHF Gavan type-G SOON!

Soon.. Very Soon.. Polisi luar angkasa ini datang ke Bumi buat nyari Bokapnya. Sekaligus mengunjungi tempat ibunya lahir (tanah airnya). Ini mengingatkanku tentang masa lalu dimana aku menyukai Gaban.. Bahkan hingga sekarang. Kalau melihat polisi Indonesia saat ini yang dipengaruhi oleh hal-hal negatif dan korupsi.. membuatku berfikir tentang perlunya Gaban di Indonesia ini.

Sekarang saya akan membahas tentang tips sederhana memakai Kendo UI. Perlu diketahui saya mendapat pertanyaan (sayang bukan pertanyaan ke blog), bagaimana cara memakai kendo UI kalau saya tidak memiliki sumbernya.. Itu jadi kebingungan saya, kenapa tidak regis di kendoUI lalu dapet link download demonya?!?

Akhirnya saya melihat bahwa ini memang kemalasan dari programer. Programer boleh malas, tetapi tidak boleh malas mendapatkan ilmu.. Harusnya mencari cara agar kemalasannya dapat membantu kinerjanya.
Untuk mempersingkat, saya sebenarnya melihat bahwa semua script kendoUI memiliki dasar yaitu jquery.kendoui.js!! tetapi ternyata jquery yang saya dapatkan dari sitenya sendiri (download) tidak lengkap.. Malah dipecah-pecah jadi kecil.

Tetapi karena anda sendiri merasa bingung harus mulai darimana memakai KendoUI. Jadi saya terpaksa membuat tulisan ini. Sambil menulis alasan kenapa memilih KendoUI, bukan UI lainnya. Sebenarnya semua sepele, ini karena saya terlanjut ketemu ama yang namanya KendoUI. Memakai Jquery.UI sebenarnya sama saja.. Tetapi saya melihat dan merasa tertarik dengan KendoUI. Karena saya sendiri tidak mau bingung pake apa.. dan saya udah ketemu Kendo UI, jadi kuputuskan bahasnya KendoUI.

AUTOCOMPLETE

Mari kita lanjut pembahasan, pembahasan saya adalah ingin membuat/memakai AUTOCOMPLETE di offline. Pertama kita menuju ke Demo autocomplete (klik kata-katanya untuk mendapatkan demonya). Didalamnya kita akan mendapatkan kotak pencarian negara Eropa, masukkan nama salah satu negara di eropa. Masukkan yang ada di list seperti Spain atau France!
Saat menulis Sp.. akan ada pilihan Spain, pilih dan Spain akan masuk ke list. proses nongol inilah autocomplete yang dimaksud, dan bisa dipilih adalah fiturnya.

Untuk penjelasan tentang autocomplete dapat menekan "Documentation"/ Dokumentasi. Dibawahnya kita akan lihat source codenya. Coba copy isinya lalu paste di notepad. Disini kita akan melihat bahwa codenya membutuhkan:

• jquery.js
• kendo.all.js
• kendo.common.css
• kendo.default.css

Karena kita akan memakainya offline. Pergi ke jquery untuk download yang terbaru. Tetapi untuk Kendo? ini adalah cara yang saya gunakan mendapatkan kendo.all.js walau sebenarnya yang akan didapat bukanlah kendo.all tetapi yang versi mini. 

Kendo.all.js kita bisa dapatkan kalau mendapatkan link download dari kendoui (harus register), namun kita bisa mendapatkannya dengan cara download langsung. Pertama coba lakukan view source dan melihat

link href="http://xxxx/kendo.common.min.css" rel="stylesheet"
link href="http://xxx/kendo.default.min.css" rel="stylesheet"

dst

Disini kamu akan mendapatkan link dari css yang penting dari gambar di atas. Pilih linknya (kalau di chrome bisa di klik maka kamu akan masuk ke cssnya).
Copy paste isinya lalu save di notepad (ato lainnya) dan beri nama yang sesuai dengan kamu ambil.

Lakukan hal yang sama untuk [script ..=".."] yang ada dibawah. Tak langsung kamu sudah mendapatkan jquery (yang pasti jalan dengan kendoui) dan kendoUInya. Setelah ini beres?!? tunggu!! belum selesai

Edit isinya (html yang kita copy paste sebelumnya) dahulu dengan posisi dimana jquery, kendoui, dan css yang kita copy paste barusan. Lalu jalankan.. Tapi tolong di perhatikan, apakah semua jalan sesuai kebutuhan?!? Kasus yang saya temui adalah tidak jalan karena dari chrome (kebetulan pakai itu) tidak memperbolehkan adanya script offline jalan (untuk keamanan). belum Lagi ditambah gambar yang kita butuhkan belum muncul?

Tapi disini fokusnya adalah kamu sudah bisa dapat CSS dan JS yang dibutuhkan. Berikutnya terserah kebutuhan.