Jqgrid : Loading Data (array)

Tulisan berikut ini untuk belajar saja, diharapkan untuk penggunaannya dalam pekerjaan mengikuti ToS dari trirand. Tulisan ini hanya menunjukkan cara load data.
Normalnya untuk load data dari sumber berbeda kita harus meminta sebagai XML. Namun saat ini kita dapat meminta sebagai JSON, untuk tulisan ini kita akan bisa load dari array yang sudah kita tentukan sendiri

menghitung otomatis pake jquery on change

kalau anda merasa topik ini bermanfaat.. tolong share di FB anda. Toh share info berguna sangat bermanfaat khan?

Berangkat dari pertanyaan berikut

Hallo Master, Minta tolong gmn ya menampilkan secara otomatis di field subtotal hasil perkalian antara textfield harga beli * textfield jumlah, maka hasilnya secara otomatis ditampilkan di field subtotal tanpa harus menekan tombol terlebih dahulu...dan ketika kita ubah qty jumlah maka subtotal akan berubah juga..

Inti disini adalah kita butuh form! maka mari buat formnya dahulu.. Jangan langsung minta script jadi karena ini percuma! why? karena kamu akan kesulitan kedepannya bila menghadapi hal yang sama

kata kuncinya adalah Jquery onchange !
memakai jquery dengan fungsi onchange.. yang berarti akan ada perubahan saat melakukan perubahan tulisan. Tetapi kita perlu gariskan lagi, memakai jquery berarti harus download jquerynya (ambil jquery yang tidak terlalu baru.. saran 1.6.x)

klik untuk keluar form

ada beberapa pertanyaan berkaitan dengan klik sesuatu untuk keluar form tertentu. Pertama adalah pemilihan form yang akan digunakan, kedua apa yang terjadi saat keluar? apakah bertambah atau ...

gan kalo mau buat radio button terus kalo di klik radio button tersebut keluar textfield, gimana ya caranya? atau key cari di google apa ya?

Kita memulai dari membuat radio nya dahulu. walau saya lebih suka memakai button. Berikutnya kita buat textarea/textbox. Lalu pastikan keduanya tersembunyi.. Saya memakai style/css "display:none" dan untuk menampilkan kugunakan jquery show. lengkapnya bisa dicoba dibawah
CODE LENGKAPNYA.

namun bila kode di atas kurang memuaskan. cobalah diperbaiki dan dicari apa yang bisa diperbaiki.. Terima kasih.

NASGOR KEROYOKAN

pasien

Berikut ini adalah projek Nasgor gabungan dari

• jqgrid
• bootstrap
• jquery ui

sebelum membahas caranya, saya mau share beberapa hal mengenai tampilan input. Pertama tampilan pasien seperti diatas ini. Kita bisa lihat bahwa tampilan ini memiliki 3 tab yaitu table, form dan keterangan. Ketiga tab itu memiliki fungsi masing-masing sebagai berikut

login multi user

SCRIPT

Karena kebanyakan orang yang masuk ke site tutorial lebih membaca script yang sudah di hasilkan daripada memahami cara kerja. Jadi link untuk script diletakkan di atas. Cara kerjanya juga sederhana, yaitu memasukkan user dan password. Tetapi ada satu tambahan! tipe user yang akan masuk!

Bila kamu masuk sebagai tipe user admin, kasir, atau moderator. Namun dalam prosesnya, kamu mengeluarkan tipe yang bisa dia gunakan! bukan semua tipe yang ada di table. Di link yang saya berikan tampaknya jelas posisi mana saja yang akan di edit.

Namun kembali lagi, diperlukan pengetahuan yang cukup untuk tahu apa yang harus dilakukan, walau penjelasannya sudah lumayan. Untuk tablenya ada 3

• user
• role
• user_role yang berisi id dari kedua table di atas.

A2S : 2 field text saling copy

Sora Aoi

Proses dalam 1 form yaitu copy dari text 1 ke text 2 bisa dilakukan secara langsung. Disini kita memanfaatkan javascript. Untuk contoh dari saya memakai jquery

cara mengambil nilai yang ada di textfield1 dan dimunculkan di textfield2 gmn y dalam 1 form?

Sebelumnya perlu difahami adalah penamaan text nya.. disini saya memanfaatkan class bukan id. Sejujurnya cuma beda kalau dipanggil memakai

• #nama_id buat yang memakai id
• .nama_class buat yang memakai class

Program Isenk CRUD pake KENDOUI part 2

Lanjutan dari yang sebelumnya.. kita coba membuat CRUD.. Yang pertama kita dapatkan adalah begini

masih belum ada isinya khan!! Mari kita lanjut ketik codingnya.. Berikut inilah coding saat ini
http://pastebin.com/qJHs2dfx

Klik dahulu link tersebut, berikut akan saya jelaskan.. Pertama kita perlu perhatikan bahwa coding ini terdiri dari 4 area yaitu

1. memanggil file luar
   
   
   
   
   
2. kontent yang berisi div dan link2 yang biasa ditaro di atas 
   
   
   
3. template
   
   
   
4. javascriptnya 
   
   
   

tentu anda bertanya-tanya.. kok template pake script?

Ask 2 Solve : bagaimana membuat script AJAX

Kesalahan pertama saya dalam bikin script-script sebelumnya adalah tidak mengajarkan logika. Pada tutorial ini saya akan ajarkan logika dan bagaimana script dapat terbentuk dan dishare ke pastebin (lihat artikel sebelumnya). Semua script dimulai dari tampilan sebagai berikut

Untuk isinya, saya menyarankan untuk penamaannya jelas buat tiap-tiap inputnya . dalam hal ini input text harus berisi

• id
• class 
• name
• value

Untuk form (<form), harus memiliki id! karena itu sangat penting di tutorial berikut ini.

Ask 2 Solve : Membuat select provinsi dan Kabupaten

Pertanyaan ini lebih kepada bagaimana cara select pertama akan merubah select ke 2. Disini kita pelajari logikanya.. Pada select pertama kita memiliki propinsi, dimana propinsi ini memiliki id. Perhatikan id disini bisa berubah angka atau huruf, tetapi rekomendasi saya angka saja.

Bootstrap Kendoui - how to install

berangkat dari gagal install (maaf bahasa inggris gw gk begitu bagus).. jadi gw bikin ini (karena gw berhasil).. Jadi ceritanya begini.. Teman tiba2 menunjukkan bahwa kendo ui punya bootstrap.. tapi sejujurnya ini tidak sesuai pemikiran gw seh.. Tapi daripada bingung, mending ikut apa yang tertulis disini.. Pertama kita akan install.

Pasang dahulu node-js. untuk download silakan menuju ke nodejs , pilih download dan kita lanjut ke step ke dua

download kendo bootstraper master .. baca-baca dari sini. Oh iya.. tolng download juga file kendoui masternya..
*yang ada di halaman depan*

Membuat Table dengan Paging

Berikut ini bisa dibilang proyek isenk-isenk aja. Jadi saya punya halaman detail, anggap aja detail jualan saya.

anggap ini tampilan awal

Kemudian saya ingin melihat halaman lain, jadi ku klik halaman 2, dan hasilnya

sekilas terlihat hasilnya sama, tetapi lihat data dibawahnya.. Berikut ini adalah flow dari programnya

Ask2Solve : ajax - json dalam prog sebenarnya.

mari balik ke "ajax-json" yang kutulis sebelumnya. Dan mari kita langsung masuk ke dalam pertanyaan dan penggunaan. Tidak semua tulisan akan saya masukkan ke script. Hanya intinya yaitu select box dan kotak timana harga muncul. Sekedar info ada beberapa hal yang perlu diketahui sebelum menjawab dan menyelesaikan masalah ini. Anggap saja ini catatan buat kita
- terdapat 4 paket (ada di atas)
- saat di klik maka harga dibawah akan update
- bentuk update sebenarnya ada 2 yaitu update tampilan harga (Rp. 3 500 000) dan update di input hidden.
- agar tidak menyulitkan maka input hidden akan saya tampilkan (jadikan text)
- sekalian bonus untuk yang bertanya cara muncul sub select kayak propinsi lalu hadir kota. Saya akan munculkan

Belajar web dari mana

lukisan yang indah

html dan css bs dibilang emang dasar dari semua web.. namun dengan standarisasi browser (thx god mikocok dah sadar), adanya mobile, dan juga kemudahan framework (non php dulu) yg memperbagus tampilan.. juga pemilihan macam2.. sy hrs mengakui kl step awal belajar adalah mempelajari bootstrap..

AJAX JQUERY - cara mendapatkan hasil berupa json

Saya takut anda kurang puas dengan artikel ini, jadi kubuat versi yang berdasarkan permintaan salah satu user. Silakan lihat disana bila anda tak yakin faham tulisan disini (Klik untuk membuka di halaman baru)

Semua itu ada cerita, berawal dari sebuah fakta kecil saat membuat program resep yaitu bagaimana cara melempar data yang kita tulis di kotak resep lalu akan memberikan hasil. Saya menemukan bahwa selain kita mengirim banyak data ke server (via ajax), kita juga bisa mendapatkan multiple data yang dapat dikeluarkan. Mari mulai dari jquery ajax sederhana. Sekedar info, anda bisa klik tulisan yang saya berikan disini.

Oh iya.. saat saya mencoba mencari di BING (karena udah terlalu sering google), saya menemukan bahwa jquery ajax sederhana merujuk pada penggunaan POST. Karena dasarnya saya ingin bahas ke AJAX bukan POST, jadi pembahasan ini memakai AJAX.

kendoui-grid

berawal dari keinginan pake JSON di kendoui.. gw ampe bongkar-bongkar dan akhirnya ketemu. Cuma ternyata metode buat memakainya di grid emang ada sedikit perbedaan walau intinya sama.

Membangun CRUD dengan Jquery EasyUI

sebelum membahas tentang program di atas, kita harus memahami tentang CRUD yaitu Create, Read, Update, dan Delete. Keempat aksi itu adalah metode standar yang akan kita buat nantinya.. Tampilan ini hanya gambaran kasar saja.. karena yang akan kita buat tentu saja berbeda..

dari artikel asli : Build CRUD Application with jQuery EasyUI

ajax sederhana : pilih select dan keluar gambar

Mumpung lagi inget punya coding neh .. jadi gw punya select dengan nama gbr didalamnya.. kalau dipilih maka gbr dibawah akan berubah.. normalnya pake PHP buat baca.. tapi biar cepet.. gw kasi NON PHP (HTML doank)

bootstrap part 1

Sejujurnya saya sendiri tidak faham kenapa bootstrap terkenal di kalangan teman web design. Tapi akhirnya saya mencoba sendiri walau tidak tahu apakah berhasil / tidak. Semua tulisan ini sebenarnya berasal dari site berikut ( http://www.onextrapixel.com ). Bila anda merasa membuang waktu membaca disini.. klik saja link tersebut, karena disini akan dibahas dengan gaya saya sendiri.

Semua ini memiliki sejarah kenapa muncul bootstrap. ternyata sumbernya dari keinginan 2 orang agar dapat memiliki web yang bisa di akses baik dari alat apapun (desktop/mobile atau pad). Namun ternyata tidak semudah itu karena masing-masing memiliki gaya dan cara menangani html di tempat mereka.

jquery: combobox - klik show on textbox

Bagaimana cara saya punya combo box (select) yang bila di klik akan terbaca nilai dan textnya? Sebenarnya pertanyaan ini sudah jelas akan jawabannya. Tetapi awalnya saya tidak memahami apa yang dibutuhkan. Tapi perlahan dipelajari apa sih yang dibutuhkan. Maka inilah awalnya. Dia memiliki table bernama produk, dimana produk ini akan ada gambarnya, nah saat saat di klik combobox yang sesuai produk.. Akan keluar nama yang sesuai dengan combo box. Untuk jawaban bisa liat langsung dibawah

Kenapa tidak pake ajax (sederhana)? jawabannya karena penanya tidak ingin memanfaatkan ajax, mengingat ajax sendiri di anggap susah dan terlalu rumit untuk solusi ini. Jadi dia ingin yang sederhana, dan disitulah saya memanfaatkan jquery.

Memakai KendoUI online

berangkat dari pembahasan "Cara memakai Kendo UI (offline)", kita sudah bisa membuat dalam mode Online. Mode online disini adalah kamu bisa memakainya di situs internet. Namun akan lebih baik bila anda menyisihkan uang untuk membayar Kendo UI. Memang terlihat boros, namun kedepannya bermanfaat! Lagipula kita bertindak adil dengan menghormati buatan orang.

Geronimo

Singkat kata sebenarnya, saya memakai cssnya yang lokal! tetapi JSnya tidak! artinya jsnya masih menunjuk ke site Jquery (http://code.jquery.com/jquery-1.7.1.min.js) dan KendoUI (yang ada di contoh sebelumnya). Dengan demikian saya tidak akan meletakkannya di server dan saya memanfaatkan KendoUI. Pada tips berikutnya saya akan mengajarkan cara membuat template kendoUI. Tidak sulit, tetapi lebih baik ada yang membimbing daripada anda salah dan takut.