Tuesday, April 9, 2019

Contoh HTML Form

Formulir Pendaftaran     Form adalah suatu bagian di dalam halaman web yang berfungsi untuk mengizinkan pengguna mengirimkan data ke web server. Dengan kata lain, form berperan sebagai user interface (antar-muka) atau media untuk berkomunikasi antara user dengan web server. Untuk membangun sebuah form terdapat beberapa tag yang digunakan, seperti tag form, input, select, textarea, dan button.

Adapun tag-tag yang digunakan untuk membuat sebuah form antara lain :
  • <form>
    Tag form memiliki attribute wajib berupa method untuk mendefinisikan metode pengiriman data dan action yang mendefinisikan aksi yang merujuk kepada lokasi pengolahan data pada form.
  • <input/>
    Tag input digunakan untuk membangun kontrol form atau interface (antar-muka) untuk mengambil request dari pengguna yang selanjutnya akan diproses oleh web server. Tag input memiliki attribute wajib berupa type yang mendefinisikan tipe kontrol dan tag name yang mendefinisikan nama dari sebuah form kontrol yang akan bertindak sebagai nama yang menampung data atau variable secara implisit.
  • <textarea>...</textarea>
    Tag textarea digunakan untuk memasukkan text yang dapat menerima data dalam jumlah karakter yang lebih banyak bahkan dalam bentuk paragraf, karakteristiknya sama dengan inputan tipe text, hanya saja kontrol inputannya lebih besar dari biasanya.
  • <select><option>...</option></select>
    Tag select digunakan untuk memasukkan inputan berupa combo-box yang merepresentasikan data dalam bentuk list atau daftar pilihan. Sama seperti elemen-elemen yang terdapat dalam form, attribute wajib pada tag select adalah name, untuk membentuk sebuah list-box maka perlu ditambahkan attribut size. Kemudian, untuk menambahkan data pada elemen combo-box atau list-box yang akan dipilih, diperlukan tag option.
Kop Kramzah FORMULIR PENDAFTARAN ANGGOTA ROHIS KRAMZAH AKHWAT
Nama Lengkap
Nama Panggilan
Kelas
Tempat, Tanggal Lahir   
Alamat
No. Handphone
Akun Medsos (WhatsApp/LINE)
Hobby
Cita-cita
Alasan/Motivasi untuk Mendaftar
Prestasi yang Pernah diraih
Pas Foto 3x4
   
Berikut adalah listing tertentu dari output form di atas :
<form method="POST" action="Formulir_Pendaftaran_Anggota_Rohis.php">
<tr>
<th bgcolor="white" colspan="6">
<img src="C:\Users\asus\Documents\kiki\SMA\ROHIS\Kop Kramzah.jpg" align="left" alt="Kop Kramzah" width="100" height="80">
<font size="5" face="elephant">FORMULIR PENDAFTARAN ANGGOTA ROHIS KRAMZAH AKHWAT>
</th>
</tr>
<tr>
<td>Nama Lengkap</td>
<td>
<input type="text" placeholder="Nama Lengkap" name="nlengkap"/>
</td>
</tr>
<tr>
<td>Tempat, Tanggal Lahir</td>
<td>
<input type="text" placeholder="Tempat Lahir" name="tempat"/>&nbsp;&nbsp;
<input type="date" name="tanggal"/>
</td>
</tr>
<tr>
<td>Alamat</td>
<td>
<textarea cols="35" placeholder="Alamat" name="alamat></textarea>
</td>
</tr>
<tr>
<td>No. Handphone</td>
<td>
<input type="text" placeholder="No. Handphone" name="nomorhp" maxlength="14"/>
</td>
</tr>
<tr>
<td>Pas Foto 3x4</td>
<td>
<input type="file" name="foto"/>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="reset"/>&nbsp;&nbsp;&nbsp;<input type="submit" value="Daftar" name="daftar"/>
</td>
</tr>
</form>