Jumat, 16 Maret 2012

Tutorial membuat form biodata

Membuat form biodata dengan html

Sebelumnya kita harus mengenal apa itu html?

Html (Hyper Text Language) biasa digunakan untuk membuat halaman web. Sebuah halaman web yang tditulis dengan format html akan dibaca dan diterjemahkan oleh web browser (contoh : internet exploler) yang disajikan dalam bentuk web.
File dapat ditulis dengan ekstensi .htm atau .html. file tersebut dapat ditulis dengan text editor notepad, wordpad dan lain-lain.

Untuk membuat form biodata kita memerlukan beberapa tag dan atribut yang disediakan html, yaitu :
  • ·         tag <table>  digunakan untuk mendefinisikan sebuah table baru.
  • ·         tag <TR> digunakan untuk mendefinisikan sebuah baris baru dalam table.
  • ·         tag <TD> digunakan untuk medefiniisikan sebuah kolom baru dalam table.
  • ·         Atribut <COLSPAN>  digunakan untuk memanjangkan sel secara horizontal.
  • ·         Atribut <ROWSPAN>  digunakan untuk memanjangkan sel secara vertical.
  • ·         Atribut <BORDER> untuk menentukan ketebalan bingkai table yang dibuat dengan satuan pixel.
  • ·         Tag <FORM> untuk membuat form dalam web.
  • ·         Atribut <NAME> digunakan untuk menentukan nama form.
  • ·         Atribut <ACTION> digunakan untuk menentukan alamat halaman web yang akan diproses masukandari form.
  • ·         Atribut <METHOD>  digunakan untuk menentukan metode pengiriman yang dipakai. Metode yang dipilih adalah get atau post.
  • ·         Tag <INPUT> digunakan untuk membuat berbagai jenis masukan didalam form yang dibuat.
  • ·         Atribut <TYPE> digunskan untuk menentukan jenis masukan yang diinginkan
  • ·         Atribut <SIZE> digunakan untuk mengatur ukuran kotak teks.
  • ·         Atribut <CHECKBOX> digunakan untuk menerima masukan berupa bilihan dengan memberi checklist.
  • ·         Atribut <RADIO>  digunakan untuk menerima masukan berupa pilihan yang sudah disediakan.
  • ·         Tag <SELECT> digunakan untuk menampilkan beberapa opsi pilihan dalam bentuk menu dropdown.
  • ·         Tag <OPTION> digunakan untuk menandai masing-masing pilihan yang akan ditampilkan dalam menu dropdown.
  • ·         Atribut type =”Submit” digunakan untuk tombol menerima seluruh masukan yang diisikan oleh pengguna.
  • ·         Atribut type=”reset” digunakan untuk membatalkan seluruh masukan yang sudah dimasukan oleh pengguna.
  • ·         Atribut type=”text”  digunakan untuk menerima masukan berupa teks dari pengguna.
Untuk mencoba memproses masukan dari form, lakukan langkah-langkah berikut :
  1. Jalankan notepad
  2. Ketik baris-baris teks dibawah ini (ketik persis)












3. Simpan dengan nama “form biodata.htm”  pada folder  C:\latihan.
4. Jalankan notepad
5. Ketik baris-baris teks dibawah ini (ketik persis)





6. Simpan dengan nama “bio.htm” pada folder C:/Latihan
7. Jalankan file form biodata.htm dari folder C:/Latihan. Kemudian isilah form yang ada, lalu tekan tombol Submit  untuk mengirim masukan atau tekan tombol Reset untuk mengulangi mengisi form.
Hasilnya adalah :














Terimakasih.. jika ada yang ingin berkomentar dan memberi tambahan silakan..

1 komentar: