Formulir Masukan HTML * Atribut
Bab ini menjelaskan form*
atribut yang berbeda untuk <input>
elemen HTML.
Bentuk Atribut
Atribut input form
menentukan bentuk yang <input>
dimiliki elemen.
Nilai atribut ini harus sama dengan atribut id dari elemen <form> yang dimilikinya.
Contoh
Bidang input yang terletak di luar formulir HTML (tetapi masih merupakan bagian dari formulir):
<form action="/action_page.php" id="form1">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
</form>
<label for="lname">Last
name:</label>
<input type="text" id="lname"
name="lname" form="form1">
Atribut Formasi
Atribut input formaction
menentukan URL file yang akan memproses input saat formulir dikirimkan.
Catatan: Atribut ini menimpa
action
atribut <form>
elemen.
Atribut formaction
berfungsi dengan jenis input berikut: kirim dan gambar.
Contoh
Formulir HTML dengan dua tombol kirim, dengan tindakan berbeda:
<form action="/action_page.php">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname"
name="lname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formaction="/action_page2.php" value="Submit as Admin">
</form>
Atribut formenctype
Atribut input formenctype
menentukan bagaimana formulir-data harus dikodekan saat dikirimkan (hanya untuk formulir dengan metode = "posting").
Catatan: Atribut ini menimpa atribut enctype dari <form>
elemen.
Atribut formenctype
berfungsi dengan jenis input berikut: kirim dan gambar.
Contoh
Formulir dengan dua tombol kirim. Yang pertama mengirim data formulir dengan pengkodean default, yang kedua mengirim data formulir yang dikodekan sebagai "multipart/formulir-data":
<form action="/action_page_binary.asp" method="post">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
<input type="submit"
formenctype="multipart/form-data"
value="Submit as
Multipart/form-data">
</form>
Atribut formmethod
Atribut input formmethod
mendefinisikan metode HTTP untuk mengirimkan data formulir ke URL tindakan.
Catatan: Atribut ini menimpa atribut metode <form>
elemen.
Atribut formmethod
berfungsi dengan jenis input berikut: kirim dan gambar.
Form-data dapat dikirim sebagai variabel URL (method="get") atau sebagai transaksi posting HTTP (method="post").
Catatan tentang metode "dapatkan":
- Metode ini menambahkan data formulir ke URL dalam pasangan nama/nilai
- Metode ini berguna untuk pengiriman formulir di mana pengguna ingin menandai hasilnya
- Ada batasan berapa banyak data yang dapat Anda tempatkan di URL (bervariasi antara browser), oleh karena itu, Anda tidak dapat memastikan bahwa semua formulir-data akan ditransfer dengan benar
- Jangan pernah menggunakan metode "dapatkan" untuk menyampaikan informasi sensitif! (kata sandi atau informasi sensitif lainnya akan terlihat di bilah alamat browser)
Catatan tentang metode "posting":
- Metode ini mengirimkan formulir-data sebagai transaksi posting HTTP
- Pengiriman formulir dengan metode "posting" tidak dapat di-bookmark
- Metode "posting" lebih kuat dan aman daripada "dapatkan", dan "posting" tidak memiliki batasan ukuran
Contoh
Formulir dengan dua tombol kirim. Yang pertama mengirimkan form-data dengan method="get". Yang kedua mengirimkan form-data dengan method="post":
<form action="/action_page.php" method="get">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname"
name="lname"><br><br>
<input type="submit" value="Submit using
GET">
<input type="submit" formmethod="post" value="Submit using
POST">
</form>
Atribut formtarget
Atribut input formtarget
menentukan nama atau kata kunci yang menunjukkan tempat untuk menampilkan respons yang diterima setelah mengirimkan formulir.
Catatan: Atribut ini menimpa atribut target <form>
elemen.
Atribut formtarget
berfungsi dengan jenis input berikut: kirim dan gambar.
Contoh
Formulir dengan dua tombol kirim, dengan jendela target yang berbeda:
<form action="/action_page.php">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname"
name="lname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formtarget="_blank" value="Submit to a new window/tab">
</form>
Atribut formnovalidate
Atribut input formnovalidate
menetapkan bahwa elemen <input> tidak boleh divalidasi saat dikirimkan.
Catatan: Atribut ini menimpa atribut novalidate dari <form>
elemen.
Atribut formnovalidate
berfungsi dengan jenis input berikut: kirim.
Contoh
Formulir dengan dua tombol kirim (dengan dan tanpa validasi):
<form action="/action_page.php">
<label for="email">Enter your
email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
<input type="submit"
formnovalidate="formnovalidate"
value="Submit without validation">
</form>
Atribut yang tidak valid
Atribut novalidate
adalah <form>
atribut.
Saat ada, novalidate menentukan bahwa semua data formulir tidak boleh divalidasi saat dikirimkan.
Contoh
Tentukan bahwa tidak ada data formulir yang harus divalidasi saat dikirim:
<form action="/action_page.php" novalidate>
<label
for="email">Enter your email:</label>
<input type="email"
id="email" name="email"><br><br>
<input type="submit"
value="Submit">
</form>
Formulir HTML dan Elemen Masukan
Tag | Description |
---|---|
<form> | Defines an HTML form for user input |
<input> | Defines an input control |
Untuk daftar lengkap semua tag HTML yang tersedia, kunjungi Referensi Tag HTML kami .