0
Form dan Input HTML
Posted by Unknown
on
18.34
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:
Posting Komentar