Share this history on :

Minggu, 14 Oktober 2012

2 Cara Membuat Form HTML


Jangan Lupa Tinggalkan Komentar Kalian Ya...!!!


Tanpa basa basi langsung saja ke pembahasan ya gan haha
Form merupakan salah satu bagian dari fasilitas yang ada di dalam website, seumpama kita mau membuat form pendaftaran, buku tamu dll. pasti membutuhkan yang namanya form. dan form ini bisa di jalankan dengan menggunakan bahasa pemrograman HTML ataupun Bahasa pemrograman PHP, keduanya sama-sama berfungsi untuk membuat sebuah halaman website.
Form ini digunakan untuk mengambil input dari user dan akan diolah lebih lanjut. Form pada halaman web didefinisikan dengan tag <form> sebagai tag pembuka dan tag </form> digunakan sebagai tag penutup. Yamg sangat terpenting Tag <form> harus memiliki dua atribut, yaitu atribut method untuk menentukan bagaimana form diberlakukan, dan atribut action yang sering diisikan URL tepat pemrosesan form selanjutnya. Adapun struktur dasar form sebagai berikut:

<form [method=”[post|get]”action=”url”]> … … </form>
Form ini mempunyai atribut input yang berfungsi untuk mendefinisikan input yang akan dimasukkan pengguna di halaman web, contohnya seperti input berupa teks dan password yang ada di form login. dan input mempunyai elemen-elemen sebagai berikut :
Name  = mendefinisikan nama dari input kontrol form
Size = mendefinisikan ukuran teks pada input kontrol
Type = mendefinisikan bentuk-bentuk input control, yang mempunyai elemen-elemen yaitu : text, password, checkbox, radio, dropdown, textarea, submit, reset, file, hidden, image, button.
Value = mendefinisikan nilai awal/reset/submit
Checked = mendefinisikan pilihan terpilih pada type radio atau checkbox
Maxlength = mendefinisikan maksimal banyaknya karakter yang dapat diterima dalam inputan.
Rows = mendefinisikan panjang baris dalam karakter
Cols =  mendefinisikan tinggi dalam karakter
Src = mendefinisikan URI (sumber gambar)
Onfocus = mendefinisikan element focus diterima
Onblur = mendefinisikan element focus dihilangkan
Onselect = mendefinisikan teks elemen yang dipilih
Onchange = mendefinisikan nilai elemen diubah

Contohnya Form :
<html>
<head>
<title>Contoh Form</title>
</head>
<body bgcolor="#00FFFF">
 <form>
  <table border="0" width="400" align="left"        cellpadding="5" cellspacing="10">
   <tr>
<td width="100">Text :</td>
<td><input type="text" size="25"></td>
   </tr>
   <tr>
<td width="100">Password :</td>
<td><inputtype="Password" size="25">   </td>
   </tr>
   <tr>
    <td width="100">Checkbox :</td>
<td>
<input type="checkbox" Checked> Checkbox 1 <br />
<input type="checkbox">Checkbox 2 <br />
<input type="checkbox">Checkbox 3 <br />
</td>
   </tr>
   <tr>
    <td width="100">Radio Box:</td>
   <td>
<input name="radiobox" value="1" type="radio" Checked>Radio 1 <br />
<input name="radiobox" value="2" type="radio">Radio 2 <br />
<input name="radiobox" value="3" type="radio">Radio 3 <br />
</td>
   </tr>
   <tr>
    <td width="100">Dropdown :</td>
   <td><select name="status">
<option>Pilihan 1</option>
<option>Pilihan 2</option>
<option>Pilihan 3</option>
<option>Pilihan 4</option>
<option>Pilihan 5</option>
  </select>
</td>
   </tr>
   <tr>
<td width="100">TextArea :</td>
     <td><textarea cols="20" rows="3"> </textarea></td>
   </tr>
  <tr>
<td width="20%" valign="top"> Image  :</td>
<td width="20%" valign="top">
<input type="file" name="foto" /> <br />&nbsp;
</td>
</tr>
   <tr>
    <td colspan="2" align="center">
<input type="submit" name="submit" value="submit">
<input type="reset" name="reset" value="reset">
</td>
   </tr>
  </table>
 </form>
</body>
</html>
Hasilnya seperti ini :

Gambar : contoh form
Sekian Dulu ya pembahasann tentang HTML, semoga semua posting tentang HTML di sini bisa bermanfaat bagi kita semua amin amin amin ya Robbal'alamin

2 komentar:

  1. mksh atas info'x y gan sangat bermanfaat sekali, sukses terus y ...

    BalasHapus
  2. oke gan sama2, terimakasih atas kunjungannya..

    BalasHapus