Untuk atribut action bisa kita isi dengan URL experience dari endpoint yang akan memproses form
Secara sederhana,—pada contoh di atas—kami akan memberi tahu file <input type="text" name="info" />0 untuk memproses data formulir
Kita akan belajar ini nanti di PHP
Kode HTML di atas, tidak akan menghasilkan apa-apa
Karena kami belum membuat lapangan
Apa itu Lapangan?
Field adalah segmen yang dapat diisi dengan data
Contoh lapangan
<input type="text" name="info" />
Field memiliki beberapa atribut yang harus disediakan
- <input type="text" name="info" />1 adalah jenis bidang
- <input type="text" name="info" />2 adalah nama field yang akan menjadi key dan variabel di dalam program
Latihan. Buat Formulir Masuk
Sebagai latihan, mari buat form login
Pada form login terdapat beberapa field dan elemen
- Kolom untuk input nama pengguna atau email;
- Bidang untuk memasukkan kata sandi;
- Kotak centang untuk mengingat saya;
- Tombol untuk masuk
Ini kodenya
<!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>_
Hasil
Sekarang perhatikan
Pada kode di atas, kita membuat empat file
- masukan <input type="text" name="info" />3 dengan tipe <input type="text" name="info" />4;
- masukan <input type="text" name="info" />5 dengan tipe <input type="text" name="info" />5;
- masukan <input type="text" name="info" />7 dengan tipe <input type="text" name="info" />8;
- masukan <input type="text" name="info" />_9 dengan tipe <input type="text" name="info" />9;
Kemudian ketiga file tersebut dikemas ke dalam tag <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>1
Nanti tag <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>_1 ini akan membuat garis
Di dalam tag <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>_1, kami membuat tag <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>4 untuk menyediakan teks ke fieldset
Kemudian, perhatikan juga atribut yang digunakan pada masing-masing field
- <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>5 atribut untuk menampilkan teks sementara (placeholder);
- <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>_6 atribut untuk meninggalkan nilai default di lapangan
Setiap field kita bungkus dengan tag <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>_7 agar terlihat rapi dan kita beri juga label dengan tag <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>8
Latihan. Buat Formulir Kontak
Pelatihan selanjutnya, kami akan membuat formulir kontak. Form ini berfungsi untuk menghubungi atau menghubungi admin
Silakan ikuti kode berikut
<!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>
Hasil
Pada contoh diatas kita berikan <!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="username..." /> </p> <p> <label>Password:</label> <input type="password" name="password" placeholder="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>_9 untuk field <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>0, sehingga field ini harus diisi dengan email saja
Coba saja isi dengan yang lain, lalu klik Send.. maka akan muncul pesan peringatan
Latihan. Membuat formulir pendaftaran
Semakin banyak latihan, semakin baik
Selanjutnya kita akan mencoba membuat formulir pendaftaran
Formulir ini berisi bidang untuk
- Masukkan nama lengkap;
- Masukkan nama pengguna;
- masukan email;
- Masukkan kata sandi;
- Masukan jenis kelamin;
- Masukan agama;
- Masukan Biografis
- dll.
Ayo buat…
<!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>
Hasil
Apa bidang baru dalam formulir?
- Bidang <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>_1;
- Bidang <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>_2;
- Bidang <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>_3
Apa perbedaan antara <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>_1 dan <input type="text" name="info" />8?
Jika kita ingin pengunjung memilih salah satu, maka kita menggunakan <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>1
Namun jika kita ingin pengunjung memilih lebih dari satu, maka kita menggunakan <input type="text" name="info" />8
Kemudian untuk <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>_8, propertinya sama dengan <!DOCTYPE html> <html> <head> <title>Contact Us</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Contact</legend> <p> <label>Name:</label> <input type="text" name="name" placeholder="your name..." /> </p> <p> <label>Subject:</label> <input type="text" name="subject" placeholder="subject..." /> </p> <p> <label>Email:</label> <input type="email" name="email" placeholder="your email..." /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>1. Hanya bentuknya saja yang berbeda
Kemudian untuk menginput teks yang panjang, kita menggunakan tag <!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>0
Latihan. Membuat Formulir Tingkat Lanjut
Field-field diatas merupakan jenis field yang sering digunakan dalam pembuatan form
Masih ada jenis field lain yang belum kami coba, seperti <!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>1, <!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>2, <!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>3, <!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>4, <!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>5, <!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>6, dll.
Mari kita coba beberapa
<!DOCTYPE html> <html> <head> <title>Form HTML</title> </head> <body> <form action="contact.php" method="POST"> <fieldset> <legend>Form</legend> <p> <label>Alamat Web:</label> <input type="url" name="name" placeholder="Masukan URL Web..." /> </p> <p> <label>Tanggal Lahir:</label> <input type="date" name="tanggal" /> </p> <p> <label>Umur:</label> <input type="number" min="10" max="90" name="umur" /> </p> <p> <input type="submit" name="submit" value="Send" /> </p> </fieldset> </form> </body> </html>
Hasil
Jika browser Anda tidak menampilkan kalender seperti di atas, coba gunakan browser versi terbaru
Apa berikutnya?
Apa yang kita pelajari dalam tutorial ini adalah tag dan bidang dasar—dan sering digunakan—dalam pembuatan formulir
Masih banyak jenis field lain yang belum kami coba. Menyukai. <!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>1, <!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>2, <!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>9, dll