Saturday, February 21, 2015

Tips Cara Membuat Form Pendaftaran dengan HTML

Hai teman-teman Ladang Tutorial, pada kali ini kita akan belajar membuat sebuah form pendaftaran dengan menggunakan HTML. Form seperti ini sangat berguna bagi sebuah website tentunya. Kalian pasti pernah dong lihat form pendaftaran? Kalo belom pernah, kalau seperti ini apa sudah pernah lihat?

Form Pendaftaran Facebook

Yups, itu adalah contoh sebuah fom pendaftaran yang saya ambil dari situs Facebook. Jadi sekarang kita akan belajar cara membuat form registrasi seperti itu.

Untuk membuat form registrasi cukup mudah, sobat Ladang Tutorial hanya perlu memasukkan script di bawah ini:
<form>
<pre><h1>Contoh Form Pendaftaran</h1></pre><br/>
  <pre>
  NIM              : <input type="text" size="11" name="nim">
  NAMA          : <input type="text" size="25" name="nama">
  JENIS KELAMIN     : <input type="radio" name="jkel" value="pria">Pria <input type="radio" name="jkel" value="Wanita">Wanita
  AGAMA          : <select name=agama>
        <option value="Islam">Islam</option>
        <option value="Katholik">Katholik</option>
        <option value="Kristne">Kristen</option>
        <option value="Hindu">Hindu</option>
        <option value="Budha">Budha</option></select>
        
  STATUS          : <input type="radio" name="status" value="Kawin">Kawin <input type="radio" name="status" value="Belum Kawin">Belum Kawin
  JURUSAN          : <select name=:jurusan" size="1">
        <option value="Teknik Informatika">Teknik Informatika </option>
        <option value="Manajemen Informatika">Manajemen Informatika </option>
        <option value="Sistem Informasi">Sistem Informasi </option>
       </select>
  KETERANGAN         :
  <textarea name="ket" rows="3" cols="30"></textarea>
  </pre>
  <input type="submit" value="Kirim">
  <input type="reset" value="Ulang">
</form>
Hal yang perlu sobat Ladang Tutorial perhatikan, script ini merupakan sebuah contoh form pendaftaran. Sobat bisa menambahkan / mengurangi form ini.
Sebagai contoh, kita akan menambah form hobi, kita bisa menambahkannya dengan checkbox, kodenya seperti ini:
  HOBI            : <input type="checkbox" name="bola" id="hobi" /><label for="bola">sepak bola</label>
               <input type="checkbox" name="bulutangkis" id="hobi" /><label for="bulutangkis">bulutangkis</label>


Jadi hasilnya akan menjadi seperti ini:
HOBI : 

No comments:

Post a Comment

Official Virgozta