Meng-Upload Image pada Satu Input FIle dengan Jquery


Unique View : 467
Rating : 0 avg / 0 votes
Short URL : http://capc.us/brOfp
Dibuat tanggal : 24-03-2010, 18:13:07

Dalam pembuatan web, hal yang paling menyebalkan adalah sesuatu yang berurusan dengan "Form" (menurut saya). Karena web developer harus memikirkan banyak hal, diantaranya:

  1. User-Interface yang simple dan friendly
  2. Validasi semua inputan yang dimasukkan oleh user
  3. Keamanan sistem dan database (masalah xss hack dan sql injection)
  4. Setelah form di-submit, bagaimana cara form tersebut masuk dalam database
  5. Cara mengeluarkan hasil inputan user pada form
  6. Gimana kalau mau upload gambar/file juga?
  7. dan lain-lain...

Referensi untuk Multiple Upload File

Nah, berdasarkan pengalaman dua-tiga hari ini. Saya merasa kesulitan sekali dalam penanganan upload beberapa gambar pada satu form. Referensi yang paling bagus adalah (untuk plugin Jquery):

Fyneworks memiliki konsep yang sangat bagus dengan membuat file-input dynamic dengan jquery, lalu membuat file-input yang sudah diisi menjadi tak terlihat.

Valums memiliki konsep dengan membuat iframe tak terlihat sebagai form baru untuk upload filenya.

Uploadify membuat form upload file dengan bantuan flash agar memperlihatkan berapa persen proses upload yang sedang berlangsung.

Implementasi

Saya sendiri lebih memilih Fyneworks karena simple dan mudah dalam implementasi, hanya saja plugin ini bentrok dengan Tiny_MCE dalam implementasinya. Untuk Valums, implementasinya rada ribet. Dan untuk Uploadify, saya pikir ini plugin paling bagus, tetapi user harus memiliki flash player untuk penggunaannya.

Akhirnya ku coba membuat script simple untuk multiple upload ini dengan konsep yang sama seperti Fyneworks. Berikut hasil percobaan pembuatannya dengan Jquery:

Seekbob - Multiple Upload Image with Jquery

Maaf untuk script saya tampung ditempat lain, karena scriptnya lumayan panjang. Sharing aja, siapa tahu ada yang membutuhkan juga. ^_^





Komentar

Nama :
email :
Smiles
Gravatar

obiesan

25-03-2010, 19:44:35

Mantep gan, boleh tuh dibagi2. Multiple upload emang enak simple ngga bolak balik upload.
Gravatar

bakazero

26-03-2010, 11:27:47

yup, tinggal kebutuhannya aja seperti apa... tiap aplikasi beda spesifikasi sih... saya baca di webdeveloperplus.com tentang konsep script seperti uploadify: Karena terdapat limitation sang user harus punya flash player, sebaiknya dikolaborasikan dengan teknik lain yang tidak perlu flash player...