Cara Membuat Form di Html
Untuk membuat form di html, kita bisa menggunkan tag <form>. Tag <form> memiliki banyak attribute yang dapat digunakan. Contohnya adalah :
- action untuk melakukan aksi yang akan dilakukan saat data dikirim.
- method metode pengiriman data
<form action="proses.php" method="GET"> </form>
Apa Itu Field ?
Field adalah ruas yang dapat diisi dengan data. Berikut ini adalah contoh penggunaan Field :
<input type="text" name="info" />
- type merupakan type dari field
- name merupakan nama dari field yang akan menjadi kunci dan variabel di dalam program
Membuat Form Login
Form Login sering kita temukan di berbagai website, contohnya adalah pada website Facebook. Fungsi dari form login tersebut adalah agar seseorang bisa masuk dan mengakses akun yang telah dibuatnya. Pada Form Login terdapat beberapa field dan elemen, diantaranya sebagai berikut :
- Field untuk menginputkan username atau email
- Field untuk menginputkan password
- Field untuk menginputkan password
<!DOCTYPE html>
<html>
<head>
<title>Form Login</title>
</head>
<body>
<form action="login.php" method="POST">
<fieldset>
<legend>Login</legend>
<p>
<label>Username:</label>
<input type="text" name="username" placeholder="Masukkan Username" />
</p>
<p>
<label>Password:</label>
<input type="password" name="password" placeholder="Masukkan Password" />
</p>
<p>
<label><input type="checkbox" name="remember" value="remember" /> Remember me</label>
</p>
<p>
<input type="submit" name="submit" value="Login" />
</p>
</fieldset>
</form>
</body>
</html>
- Username menggunakan input type text
- Password menggunakan input type password
- Remember Me menggunakan input type checkbox
- Tombol Submit menggunakan input type submit
- placeholder yang fungsinya untuk menampilkan teks sementara
- value yang fungsinya untuk memberikan nilai default pada field
Cara Membuat Form Pendaftaran
Form pendaftaran sering kita temukan pada beberapa website, contohnya adalah website pemerintah. Fungsi form pendaftaran pada website pemerintah adalah untuk membuat sebuah akun dan biasanya akun tersebut digunakan untuk melaporkan dan mengelola seluruh kegiatan pemerintahan. Biasanya form pendaftaran memiliki beberapa field, berikut ini adalah field field yang terdapat pada form pendaftaran :
- Input Username
- Input Nama Lengkp
- Input Email
- Input Password
- Input Jenis Kelamin
- Input Agama
- Input Biografi
<!DOCTYPE html>
<html>
<head>
<title>Registrasi</title>
</head>
<body>
<form action="contact.php" method="POST">
<fieldset>
<legend>Registrasi</legend>
<p>
<label>Nama:</label>
<input type="text" name="nama" placeholder="Nama lengkap..." />
</p>
<p>
<label>Username:</label>
<input type="text" name="username" placeholder="Username..." />
</p>
<p>
<label>Email:</label>
<input type="email" name="email" placeholder="Your email..." />
</p>
<p>
<label>Password:</label>
<input type="password" name="password" placeholder="Passowrd..." />
</p>
<p>
<label>Jenis kelamin:</label>
<label><input type="radio" name="jenis_kelamin" value="laki-laki" /> Laki-laki</label>
<label><input type="radio" name="jenis_kelamin" value="perempuan" /> Perempuan</label>
</p>
<p>
<label>Agama:</label>
<select name="agama">
<option value="islam">Islam</option>
<option value="kristen">Kristen</option>
<option value="hindu">Hindu</option>
<option value="budha">Budha</option>
</select>
</p>
<p>
<label>Biografi:</label>
<textarea name="biografi"></textarea>
</p>
<p>
<input type="submit" name="submit" value="Daftar" />
</p>
</fieldset>
</form>
</body>
</html>