Form dan Input HTML
Form
merupakan salah satu elemen HTML yang
digunakan untuk mendapatkan masukan dari
pengguna web. Pengguna web dapat memasukkan input
melalui halaman-halaman HTML. Umumnya pengolahan
form dilakukan pada server dengan
menggunakan skrip yang bersifat server-side
seperti PHP, ASP dan lain sebagainya.
). Untuk membuat form digunakan tag awal
<form> dan tag penutup </form>.
Sintaks
penulisannya :
<form
action=”url” method=”get|post”>
</form>
Jenis
masukan dalam satu formulir dibedakan menjadi :
Text
digunakan
untuk mengisi suatu nilai dapat berupa teks atau angka.
Radio
elemen isian
berupa pilihan dimana hanya satu pilihan yang dapat dilakukan.
Checkbox
elemen yang
menyediakan beberapa pilihan bisa lebih dari satu.
List elemen
pilihan dalam bentuk daftar.
Button elemen berupa tombol untuk
melakukan suatu proses.
Submit
elemen
tombol yang digunakan untuk memanggil url.
Reset elemen tombol yang digunakan untuk
mengembalikan kondisi awal.
Image digunakan sebagai pengganti
button, berupa gambar yang dapat melakukan proses.
Textarea elemen yang dapat menampung
kumpulan teks ketikan dari user.
File elemen button yang dapat memanggil
file atau gambar dari storage.
Password
elemen berupa teks yang khusus digunakan untuk mengisi password.
Tag
<TEXTAREA>
Tag <TEXTAREA>
digunakan untuk membuat sebuah kotak teks multi baris. Tag ini mempunyai
beberapa
atribut, yaitu :
Name:
Mendefinisikan nama Objek Area
Rows:
Menentukan Jumlah baris text area
Cols
: menentukan lebar text
area
Contoh:
<html>
<head
>
<title>Contoh
Tag Textarea dan Tag Select</title> </head>
<body>
<table
width="100%" >
<tr>
<td>Pilih
Jenis Kendaraan </td>
<td><select
name="motor">
<option
value="yamaha">Yamaha</option >
<option
value="honda">Honda</option >
<option
value="suzuki">Suzuki</option></select></td>
</tr>
<tr>
<td>
Alamat </td>
<td><textarea
name="alamat" cols="55"
rows="5"></textarea></td>
</tr >
</table
>
</body>
</html
>
Hasil:
Tag
<INPUT>
Tag
<INPUT> digunakan untuk membuat komponen-komponen yang digunakan
untuk meminta informasi dari user, misalnya
kotak teks, kotak pilihan, tombol dan
lain-lain. Tag ini tidak memerlukan tag penutup.
Tipe input
yang dapat dibuat adalah :
Text : digunakan untuk membuat kotak teks
Password : digunakan
untuk membuat kotak teks, tetapi semua
karakter akan ditampilkan dengan tanda *.
Check Box : digunakan untuk membuat suatu
daftar pilihan yang dapat dipilih lebih dari satu.
Radio : digunakan untuk membuat suatu
daftar pilihan yang hanya dapat dipilih satu saja.
File : digunakan untuk memanggil file atau gambar dari
storage.
Hidden : Digunkan
untuk mengirim data ke suatu aplikasi yang tidak diinginkan untuk dilihat
oleh browser.
Reset : digunakan untuk membuat tombol yang fungsinya untuk
menghapus semua isian form yang telah diberikan.
Submit : digunakan
untuk membuat tombol yang fungsinya untuk mengirimkan data form agar diolah.
Contoh:
<html>
<head
>
<title>Input
Data Berita</title>
</head
>
<body
text="#0000FF" >
<h2>Tambah
Berita</h2>
<form
method="post" action="#" enctype="multipart/form -data">
<table
width="100%">
<tr>
<td>Judul</td>
<td> :
<input type="text" name="judul"
size="60"/></td>
</tr>
<tr>
<td>Kategori</td>
<td>
:<select name="kategori"
>
<option
value="kategori_berita" selected>- Pilih Kategori </option>
<option
value="komputer">Komputer
<option
value="ekonomi">Ekonomi
<option
value="pendidikan">Pendidikan
</select>
</td>
</tr>
<tr>
<td>Headline</td>
<td> :
<input type="radio" name="headline" value="Y" checked/>Y
<input
type="radio" name="headline" value="N"/>
N</td>
</tr>
<tr>
<td>Isi
Berita</td>
<td> :
<textarea name="isi_berita" cols="45"
rows="6"></textarea>
</td>
</tr>
<tr>
<td>Gambar</td>
<td> :
<input type="file" name="fupload"
size="40"></td>
</tr>
<tr>
<td
colspan=2>
<input
type="submit" value="Simpan"/>
<input
type="reset" value="Reset"/>
</td>
</tr>
</table>
</form>
</body>
</html>
Hasil:
Tidak ada komentar:
Posting Komentar