Kosongempat’s Weblog

Alumni Budi Luhur Angkatan 04

Tutorial Form Cepat dengan QuickForm [1]

Dalam pembuatan setiap aplikasi penggunaan sebuah form adalah sesuatu yang wajib ada sebagai sebuah media untuk meng-input data dari user, tapi terkadang pembuatan sebuah form menjadi sangat merepotkan dikarenakan inputan yang dibutuhkan oleh system atau aplikasi sangat banyak dan kompleks. Bila hal itu menimpa anda coba solusi yang ditawarkan oleh Pear berupa class yang berguna untuk mengubah cara pembuatan setiap element dalam form menjadi lebih ringkas dan efektif, selain itu class ini juga telah menyediakan validasi form yang sudah cukup komplit, dari validasi masukan angka, masukan email, dan validasi lainya yang sudah sangat sering dipakai.

Berikut ini adalah beberapa contoh yang sangat simple dari kami kosongempat, hal yang pertama harus dilakukan adalah mendowload paket class QuickForm di sini, paket class itu berada dalam sebuah folder HTML. Nantinya file yang project kita akan diposisikan sama dengan folder HTML tadi,

Setelah download mari kita mulai bagaimana cara memulai menggunakan QuickForm, berikut ini adalah file yang akan kita buat :

  1. <?php
  2. require_once ‘HTML/QuickForm.php’;
  3. $form =& new HTML_QuickForm(‘frmTest’, ‘get’);
  4. $form->addElement(‘header’, ”, ‘Normal Elements’);
  5. $form->addElement(‘hidden’, ‘ihidTest’, ‘hiddenField’);
  6. $form->addElement(‘text’, ‘itxtTest’, ‘Test Text:’);
  7. $form->addElement(‘password’, ‘ipwdTest’, ‘Test Password:’);
  8. $form->addElement(‘radio’, ‘iradTest’, ‘Test Radio Buttons:’, ‘Check the radio button #1’, 1);
  9. $form->addElement(‘radio’, ‘iradTest’, ‘(Not a group)’, ‘Check the radio button #2’, 2);
  10. $form->addElement(‘textarea’, ‘itxaTest’, ‘Test TextArea:’, array(‘rows’ => 3, ‘cols’ => 20));
  11. $select = $form->addElement(‘select’, ‘iselTest’, ‘Test Select:’, array(‘A’=>’A’, ‘B’=>’B’,’C’=>’C’,’D’=>’D’));
  12. $form->addElement(‘submit’, ‘isubTest’, ‘Test Submit’);
  13. $form->display();
  14. ?>

Penjelasan:

  • Baris 2 : Mengikutsertakan file utama QuickForm.
  • Baris 3 : Membuat object dari class QuickForm
  • Baris 5-8 : Untuk menambahkan sebuah element yang akan dimasukan ke dalam form, gunakan fungsi addElement, karena addElement berada dalam class HTML_QuickForm() maka pemanggilan fungsi tersebut harus disertai dengan nama object dari class QuickForm. Berikut ini adalah list element yang telah disediakan QuickForm :

‘hidden’
‘reset’
‘checkbox’
‘file’
‘image’
‘password’
‘radio’
‘button’
‘submit’
‘select’
‘hiddenselect’
‘text’
‘textarea’
‘link’
‘advcheckbox’
‘date’
‘static’
‘header’
‘html’
‘hierselect’
‘autocomplete’
pada baris ini element yang digunakan adalah header element ini digunakan untuk memberikan judul pada table yang menampung form. Parameter pertama adalah jenis element yang akan diadd, parameter yang kedua adalah nama dari element karena element header ini tidak memerlukan nama, maka bisa dikosongkan. Sedangkan pameter yang keiga adalah label yang akan dimunculkan di header itu nantinya. Hal yang sama terjadi untuk element hidden, text, password.

  • baris 10-11 : untuk element radio dibutuhkan lima buah parameter, paramater pertama, kedua dan ketiga berfungsi sama seperti element yang sudah dibahas diatas, dan fungsi ini akan sama pada element yang lain. Sedangkan parameter keempat adalah label yang akan ditampilkan disamping radio button nantinya, dan parameter keenam adalah nilai atau value yang akan dikirimkan saat tombol submit ditekan.
  • baris 13 : Agar jumlah baris dan kolom pada textarea yang dibuat bisa kita sesuaikan dengan keinginan kita, maka ditambahkan sebuah parameter keempat yang berisikan array, array ini berisikan nama properties dan nilai dari propertiesnya.
  • baris 15 : Sama halnya dengan textarea untuk element select, juga mengisikan parameter keempat yang berisikan array, namun array ini berisikan label pilihan dan nilai dari pilihan tersebut.
  • baris 17 : Terakhir adalah tambahkan tombol submit
  • baris 20 : Dan akhirnya tutup penggunaan class dengan display untuk menampilkan form yang telah kita generate.

Selanjutnya kita akan belajar bagaimana menerapkan validasi pada form yang telah kita buat.

June 7, 2008 - Posted by | Tutorial | , , ,

6 Comments »

  1. lg googling ttg htmlquickform, eh.. liat – liat di hasil googling, ada address link kosongempat…. mikir…mikir
    pengin nih bikin blog u alumni bl fti 04, eh… pas dklik taunya anak bl yang bikin (udah gitu pas liat liat kayaknya kenal ni org2nya). btw kayaknya asslab doang y ???!!!!

    Comment by fikri | May 13, 2009 | Reply

  2. akhirnya ada yang komentar juga, jadi bisa dilanjutin deh tutorial tentang satu ini….

    Comment by gunsanadi | June 18, 2008 | Reply

  3. sama pin… laperrr….
    lg atit ni…😦 hiks..

    oia, keyen tu gun,mantep, utk tar ni, pasti dede pake.. tp tetep, guuuuuunnnn…..!!!!😀
    huehehehehe

    Comment by fara | June 17, 2008 | Reply

  4. Gw mo komentar niy ,.,

    Gw laperrrrr

    *kabuuurrrrrr

    Comment by vini | June 16, 2008 | Reply

  5. Kayanya, lagi pake tuh gun..
    Udah ketemu blom bugs nya yg kemaren?

    Comment by shobby | June 15, 2008 | Reply

  6. aduh…sepi banget yah komentarnya.
    daripada ga ada seorangpun yang komentar, w ajah deh..:D

    Comment by dharto | June 14, 2008 | Reply


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: