html bentuk

HTML Forms dan Input

Formulir HTML digunakan untuk memilih berbagai jenis input pengguna.

Contoh

Cobalah Sendiri - Contoh

Buat teks ladang
Cara membuat bidang teks. Pengguna dapat menulis teks dalam kolom teks.
Buat password
Cara membuat password.
(Anda dapat menemukan lebih banyak contoh di bagian bawah halaman ini)

Bentuk HTML

Bentuk HTML yang digunakan untuk melewatkan data ke server.
Bentuk HTML dapat mengandung unsur-unsur masukan seperti bidang teks, checkbox, radio-tombol, tombol submit dan banyak lagi. Bentuk A juga dapat berisi daftar pilih, textarea, fieldset, legenda, dan elemen label.
Tag <form> digunakan untuk membuat bentuk HTML:
<form>
.
input elements
.
</form>


Bentuk HTML - Input Elemen

Unsur bentuk yang paling penting adalah unsur <input>.
Unsur <input> digunakan untuk memilih informasi pengguna.
Sebuah elemen <input> dapat bervariasi dalam banyak cara, tergantung pada jenis atribut. Sebuah elemen <input> dapat dari text field jenis, checkbox, password, tombol radio, tombol submit, dan banyak lagi.
Jenis input yang paling umum dijelaskan di bawah ini.

Fields Text

<input type="text"> mendefinisikan field input satu baris yang pengguna dapat memasukkan teks ke:
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>
Bagaimana kode HTML di atas terlihat dalam browser:
Nama depan: 
Nama belakang: 
Catatan: Bentuk itu sendiri tidak terlihat. Juga mencatat bahwa lebar default kolom teks adalah 20 karakter. 

Sandi Lapangan

<input type="password"> mendefinisikan field kata sandi:
<form>
Password: <input type="password" name="pwd">
</form>
Bagaimana kode HTML di atas terlihat dalam browser:
Sandi: 
Catatan: Karakter dalam bidang password bertopeng (ditampilkan sebagai tanda bintang atau lingkaran).

Radio Buttons

<input type="radio"> mendefinisikan tombol radio. Tombol radio membiarkan pengguna memilih HANYA SATU dari sejumlah pilihan:
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
Bagaimana kode HTML di atas terlihat dalam browser:
Laki-laki
Perempuan

Checkbox

<input type="checkbox"> mendefinisikan kotak centang. Checkbox membiarkan pengguna pilih ZERO atau LEBIH pilihan dari sejumlah pilihan.
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
Bagaimana kode HTML di atas terlihat dalam browser:
Saya memiliki sepeda
Saya memiliki mobil

Kirim Tombol

<input type="submit"> mendefinisikan tombol kirim.
Sebuah tombol submit digunakan untuk mengirim data formulir ke server. Data dikirim ke halaman tertentu dalam aksi atribut form. File didefinisikan dalam atribut aksi biasanya melakukan sesuatu dengan input yang diterima:
<form name="input" action="html_form_action.asp" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
Bagaimana kode HTML di atas terlihat dalam browser:
Username: 
Jika Anda mengetik beberapa karakter dalam kolom teks di atas, dan klik "Kirim" tombol, browser akan mengirimkan masukan Anda ke halaman yang disebut "html_form_action.asp". Halaman ini akan menunjukkan masukan yang diterima.

Contoh

Contoh lainnya

Tombol radio
Bagaimana menciptakan tombol radio.
Checkbox
Cara membuat kotak centang. Seorang pengguna dapat memilih atau tidak memilih kotak centang.
Daftar drop-down sederhana
Cara membuat daftar drop-down sederhana.
Daftar drop-down dengan nilai pra-dipilih
Cara membuat daftar drop-down dengan nilai pra-dipilih.
Textarea
Cara membuat multi-line input teks kontrol. Dalam teks-daerah pengguna dapat menulis jumlah yang tidak terbatas karakter.
Buat tombol
Cara membuat tombol.
Contoh

Form Contoh

Fieldset sekitar form-data
Cara membuat perbatasan di sekitar elemen dalam formulir.
Formulir dengan bidang teks dan tombol submit
Bagaimana menciptakan sebuah form dengan dua text field dan tombol kirim.
Formulir dengan kotak centang
Cara membuat sebuah form dengan dua kotak centang dan tombol kirim.
Bentuk dengan tombol radio
Bagaimana menciptakan sebuah form dengan dua tombol radio, dan tombol kirim.
Kirim e-mail dari bentuk
Cara mengirim e-mail dari formulir.

Form HTML Tag

New : tag baru di HTML5.
TagDescription
<form>Defines an HTML form for user input
<input>Defines an input control
<textarea>Defines a multiline input control (text area)
<label>Defines a label for an <input> element
<fieldset>Groups related elements in a form
<legend>Defines a caption for a <fieldset> element
<select>Defines a drop-down list
<optgroup>Defines a group of related options in a drop-down list
<option>Defines an option in a drop-down list
<button>Defines a clickable button
<datalist>NewSpecifies a list of pre-defined options for input controls
<keygen>NewDefines a key-pair generator field (for forms)
<output>NewDefines the result of a calculation