Membuat Form Di HTML

$[ Enjoy Materi ]$

Form HTML adalah sebuah area yang mengandung elemen-elemen form. Elemen form adalah sebuah elemen yang memungkinkan user untuk memasukkan informasi seperti text, textarea, menu drop-down, radio button, checkbox,dll. Sebuah form didefinisikan dengan tag <form>


Field Text
Contoh:

<form>
Nama Depan : <input name="NamaDepan" type="text" id="NamaDepan" />
<br>
Nama Belakang : <input name="NamaBelakang" type="text" id="NamaBelakang" />
</form>

Hasil:



Field Text - Password
Contoh:

<form>
Username : <input name="Username" type="text" id="Username" />
<br>
Password : <input name="Password" type="password" id="Password" />
</form>

Hasil:



Checkbox
Contoh:

Hobi:<br>
<form>
<input name="majalah" type="checkbox" id="majalah" value="majalah"> Baca Majalah
<br>
<input name="olahraga" type="checkbox" id="olahraga" value="olahraga" checked> Olahraga
<br>
<input name="mancing" type="checkbox" id="mancing" value="memancing"> Memancing
</form>

Hasil:



Radio Button
Contoh:

Jenis Kelamin:<br>
<form>
<input name="jeniskelamin" type="radio" value="L"> Laki-Laki
<br>
<input name="jeniskelamin" type="radio" value="P" > Perempuan
<br>
</form>

Hasil:



Drop Down Menu
Contoh:

<form>
<select name="select">
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982" selected>1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
</select>
</form>

Hasil:



Textarea
Contoh:

<form>
<textarea name="textarea" cols=zs"50" rows="5">isikan komentar anda disini</textarea>
</form>

Hasil:



File Upload
Contoh:

<form>
<input name="fileupload" type="file" />
</form>

Hasil:



Button Controls
Contoh:

<form>
<input type="submit" value="Kirim" />
</form>

Hasil:

Writer By : @mr.mcf404