Monday, February 11, 2013

Membuat Form Isian Dengan HTML Berbasis Web Server (XAMPP)

Untuk mempelajari hal ini, tentunya anda sudah menginstall XAMPP pada komputer/dekstop anda yang anda bisa download disini.  Setelah  itu anda, bisa membuka salah satu Text Editor favorit anda misalkan saja Notepad ++ yang juga anda bisa download disini. Setelah itu silahkan ketikkan contoh html dibawah ini.


<html>
<head>
<title>Homepage Hery Berbagi</title>
<head>

<body>
<center><b>Selamat Datang<br>Di Halaman Komentar</b></center>
<form methode="post" action="" >
Nama anda:<input type="text" size="10" maxlength ="40" name="nama"><br>
Komentar anda :<textarea rows="5" size="10" cols="20" name="komentar"></textarea><br>
<input type="submit" value="Kirim">
</form>
</body>
</html>


Simpan file tersebut dengan nama formlatihan.html dan tempatkan file tersebut pada pada htdocs pada folder baru misalkan saja formlatihan di xampp kemudian running di browser http://localhost/formlatihan/formlatihan.html . Jika berhasil maka akan tampil sebagai berikut.

Source Code Lengkap : download disini

Penjelasan :

  1. Tag .<tag ></tag> . HTML selalu terdiri dari tag awal dan tag penutup .Tag ini digunakan oleh browser untuk membedakan mana yang merupakan perintah HTML dan mana yang merupakan teks biasa.
  2. <title>Homepage Hery Berbagi</title> akan ditampilkan pada Tab Browser.
  3. <center><b>Selamat Datang<br>Di Halaman Komentar</b></center> berarti maksudnya untuk mengetengahkan kalimat yang berada tag <center> .... </center> tsb. Nah kemudian <br> untuk membuat baris baru. Sedangkan <b> ... </b> untuk menebalkan huruf.
  4. <body> ..... </body> disini tempat menuliskan isi utama dokumen HTML .Semua yang berada diantara kedua tag ini adalah isi utama dari halaman anda. 
  5. <form> .... </form> . Atribut yang biasa digunakan pada tag ini antara lain :action dan methode. action menentukan nama file yang akan dieksekusi  setelah kita mengirimkan form ini ( misalnya dengan submit button) . File tersebut juga merupakan file yang bertugas untuk memproses input yang sudah dimasukkan pengunjung melalui form ini. Method - atribut ini menentukan cara HTML untuk mengirimkan isi input dari pengunjung dan bisa berisi get/post. Dalam contoh diatas penulis menggunakan Post.
  6. Tag Field. Ada 3 Jenis field yang digunakan dalam contoh diatas yaitu field Teks (text), Area Teks (textarea) dan Submit button. Sebenarnya masih banyak tipe input yang lain seperti radio button,password,dan sbg. type - yang menentukan jenis input field anda. Disinilah anda mendefinisikan  jenis field termasuk text,textarea atau password. name- merupakan nama field , yang sangat bermanfaat bagi PHP untuk melakukan proses selanjutnya pada input yang diberikan pengunjung. size - menentukan ukuran horizontal field. Satuannya adalah jumlah spasi. maxlength - Menentukan jumlah karakter masksimum yang bisa diinput