Top Menu

HTML (Form HTML)

Form HTML


Seperti namanya form yang berarti isian atau formulir. Form HTML menyediakan input bagi user untuk mengisikan suatu data guna diproses oleh PHP. Membuat form HTML boleh dibilang sangatlah mudah. Karena tidak membutuhkan keahlian programming.
Bentuk Dasar Form HTML
Setiap form pada HTML akan diapit oleh tag <form> dan </form>. Tag <form> memiliki beberapa attribut diantaranya:
  • Action – attribut ini berfungsi untuk memberitahu file mana yang akan digunakan untuk memproses form yang dikirim. Contoh “fileku.php” atau “folderku/fileku.php” atau URL lengkap http://www.domainku.com/fileku.php.
  • Method – attribut ini berfungsi untuk menentukan tipe pengiriman data. Bisa berupa POST atau GET.
  • Name – attribut ini berguna untuk alamat yang merupakan bagian dari javascript. Nama form tidak dikirim ke server saat form disubmit atau dikirim.
Contoh lengkap penulisan form sebagai berikut:
<form name=”formku” action=”proses.php” method=”POST”>
...
</form>
Macam Input Type
Sebagian besar penulisan form akan selalu digunakan input type. Tag input dan attributnya yaitu type akan menentukan output yang ditampilkan oleh browser. Bisa berupa tombol, check box, password box dan sebagainya. Untuk lebih memperjelas lihatlah contoh di berikut
<form action="tidak_ada.php" method="POST">
<input type="text" name="coba" size="30" maxlength="45">
<input type="submit" value="GO!!">
</form>
Setiap type juga memiliki attribut sendiri-sendiri. Tapi setiap type pasti memiliki attribut name.
Berikut ini beberapa tipe type yang dapat anda gunakan.
  • Text – tipe ini seperti yang terlihat di gambar yaitu berupa textbox. Text memiliki tiga attribut diantaranya: 
    • Size – yang merupakan ukuran panjang dari textbox.
    • Maxlength – merupakan karakter maksimal yang dapat ditampung oleh textbox.
    • Value – merupukan isi dari textbox yang telah ditetapkan. User dapat menggantinya dengan langsung mengetikkan pada textbox.
  • Password – hampir sama dengan text hanya saja karakter yang diketikkan akan berupa asterik (*).
  • Hidden – input ini tidak dimunculkan di layar browser. Dapat digunakan untuk menyimpan nilai atau variabel yang digunakan untuk halaman berikutnya.
  • Submit – tipe ini akan menampilkan tombol submit(pengiriman). Nama tombol diambil dari nilai attribut value. Jika tidak ada maka namanya Submit Query.
  • Reset – tipe ini digunakan untuk membersihkan segala isian pada form. Attributnya hampit sama dengan submit.
  • File – tipe ini digunakan untuk proses peng-upload-an file. Tampilannya hampir sama dengan tipe text tapi disebelahnya ada tombol “browse”. Ketika user menekan browse akan muncul kotak dialog untuk memilih file yang diupload.
  • Checkbox – tipe ini akan memunculkan tampilan checkbox. Biasanya checkbox digunakan untuk memilih lebih dari satu pilihan. Jika pada tag ini terdapat kata “checked” maka checkbox tersebut akan ditandai.
  • Radio – tipe ini akan menampilkan tampilan radio button. Tipe ini digunakan jika kita harus memilih hanya satu pilihan. Jika ada kata “checked” maka radio tersebut akan ditandai(default).
  • Image – fungsinya sama dengan submit hanya saja anda dapat menentukan gambar sebagai pengganti tombol.
Kode berikut ini mencontohkan penggunaan macam-macam type tersebut kecuali File dan Image.
<form action="tidak_ada.php" method="POST">
<h2>Formulir Pendaftaran</h2>
Nama: <input type="text" name="nama" value="Ketik Nama Disini" size="30" maxlength="50"><br>
Password: <input type="password" name="nama" size="30" maxlength="50"><br>
<input type="checkbox" name="mailing" value="ya"> Jika dicek anda bersedia menjadi anggota mailing list kami.
<input type="hidden" name="sembunyi" value="anda tidak dapat melihatku">
<p>
Status Anda?<br>
<input type="radio" name="status" value="menikah">Sudah Menikah<br>
<input type="radio" name="status" value="belum">Belum Menikah<br>
<input type="radio" name="status" value="duda_janda">Duda/Janda<br>
</p>
<input type="submit" value="DAFTAR"> <input type="reset" value="RESET">
</form>

Posting Komentar

Copyright © Alfi Gusman | 2012