HTML Form dan PHP

Pada bab ini yang akan dipelajari adalah

  • Pengenalan Superglobal Arrays
  • Bagaimana membuat HTML form
  • Bagaimana PHP menerima dan mengolah data dari HTML form 

Superglobal Array

PHP menyediakan beberapa superglobal array yagn dapat digunakan oleh programmer. Setiap array ini memiliki fungsi masing-masing. Superglobal array adalah variabel khusus yang akan selalu dapat digunakan pada skrip PHP. Ada pun yang termasuk dalam superglobal array pada PHP adalah

 

namun pada bab ini kita hanya akan membahas sebagian dari superglobal array ini, semetara beberapa array lainnya akan dibahas pada bab lain.

$_SERVER

$_SERVER menyimpan data mengenai server dan skrip yang sedang dieksekusi. Kegunaan lainnya dari array ini adalah dapat mengakses ip address dari pengunjung situs atau dari halaman mana pengunjung di refer ke halaman situs kita dan berbagai fungsi lainnya.

Pada contoh berikut ini kita akan melihat penggunaan dari array ini

<?php

// Path dari file yang sedang dieksekusi

echo $_SERVER[‘PHP_SELF’], “\n\n”;

// data browser yang digunakan user

echo $_SERVER[‘HTTP_USER_AGENT’], “\n\n”;

// darimana user direfer menuju halaman ini

echo $_SERVER[‘HTTP_REFERER’], “\n\n”;

// IP address dari user

echo $_SERVER[‘REMOTE_ADDR’], “\n\n”;

// tampilkan semua informasi dari $_SERVER

print_r($_SERVER);

?>

maka tampilan dari skrip di atas adalah seperti yang ditunjukkan pada gambar x

Gambar x. tampilan dari test_server.php

$_GET

superglobal array $_GET merupakan salah satu dari dua superglobal array yang paling sering digunakan dalam pemrograman PHP untuk mengirim data dari satu hamlaman ke halaman lainnya. Data pada $_GET dikirim melalui URL yang memiliki format sebagai berikut :

http://amazingsabang.com/pesan.php?nama=sayed&pesanan=kopi

Tanda tanya (?) dan teks setelahnya disebut sebagai query string. Query string akan selalu dimulai dengan tanya (?) dan diikuti oleh nama variabel (nama pada contoh di atas) dan nilai dari variabel tersebut. Antara variabel dan nilai akan dipisahkan oleh tanda sama dengan (=). Untuk menambahkan variabel kedua dan seterusnya gunakan tanda and (&) pada akhir dari nilai variabel pertama. Untuk variabel kedua dan seterusnya juga mengikuti format di atas, nama variabel kemudian tanda sama dengan dan diikuti oleh nilai dari variabel tersebut.

Yang perlu menjadi perhatian bahwa nilai dari sebuah variabel yang dikirim melalui URL tidak menggunakan tanda petik. Hal ini akan menimbulkan masalah ketika sebuah nilai dari sebuah variabel memiliki spasi atau karakter khusus lainnya.

URL Encoding

Keuntungan dari menggunakan PHP adalah sudah tersedianya fungsi untuk men-encode URL yang berguna untuk merubah nilai dari sebuah variabel sehingga nilai ini bisa dikirim melalui URL, yaitu urlencode. Fungsi ini bekerja bersama dengan fungsi urldecode(). Kedua fungsi ini akan sangat membantu dalam mengirimkan nilai yang komplek dari sebuah variabel.

Pada latihan berikut ini kita akan melihat bagaimana fungsi ini digunakan. Sehingga kita akan lebih memahami penggunaan fungsi ini.

Latihan

  1. ketikkan kode berikut pada teks editor

<?php

$string_komplek = “variabel ini komplek & harus di encode sebelum dikirim”;

// output tanpa encode

echo “$string_komplek <br /><br />”;

// encode $string_komplek

$string_encoded = urlencode($string_komplek)

// output setelah diencode

echo “$string_encoded <br /><br />”;

// decode kembali

echo urldecode($string_encoded);

?>

  1. simpan dengan nama testencode.php pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testencode.php

maka tampilan dari skrip di atas adalah sebagai berikut

Mengakses Variabel pada URL

kita dapat menggunakan supergolbal array $_GET untuk mengakses variabel di dalam query string. Untuk mengakses variabel pada query string menggunakan array ini maka nama dari variabel digunakan sebagai key untuk mengambil nilainya. Jadi array ini menjadi seperti assosiative array. Misalkan saja untuk mengakses variabel pada contoh di atas kita dapat menggunakan kode sebagai berikut

<?php

echo “nama : $_GET[‘nama’] <br />”;

echo “pesanan : $_GET[‘pesanan’] <br />”;

?>

Pada contoh berikut kita akan menggunakan $_GET untuk menampilkan informasi sesuai dengan pilihan dari user. Halaman yang ditampilkan ini tergantung pada query string yang diterima oleh skrip PHP kita.

Latihan

  1. ketikkan kode berikut pada teks editor

<ul id=”menu”>

<li> <a href=”testget.php”>Indeks</a> </li>

<li> <a href=”testget.php?laman=siapa”>siapa saya</a> </li>

<li> <a href=”testget.php?laman=alamat”>alamat saya</a> </li>

</ul>

<?php

//cek apakah user mengklik salah satu link

if(isset($_GET[‘laman’])) {

$laman = htmlentities($_GET[‘laman’]);

} else {

$lama = NULL;

}

switch($laman) {

case ‘siapa’:

echo ”

<h1>Siapa Saya </h1>

<p> hmmm pertanyaan yang sulit, I am nobody </p>”;

break;

case ‘alamat’:

echo ”

<h1>Alamat Saya</h1>

<p> ke email aja ya

<a href=\”mailto:sayed.muchallil@elektro.unsyiah.ac.id\”>

sayed.muchallil@elektro.unsyiah.ac.id

</a> </p>”;

break;

default:

echo ”

<h1> Pilih salah satu halaman! </h1>

<p>

untuk keterangan lebih lanjut silahkan klik link-link di atas

</p>”;

break;

}

?>

  1. simpan dengan nama testget.php pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testget.php

ketika pertama kali dipanggil, halaman testget.php akan memiliki tampilan seperti pada gambar x.

Gambar x. tampilan default dari laman testget.php

setelah link siapa saya di klik maka tampilan nya menjadi seperti berikut

Gambar x. tampilan setelah link siapa saya di klik

Hal yang perlu diperhatikan dalam penggunaan $_GET adalah adanya kemungkinan user dapat memasukkan informasi yang tidak diinginkan ke dalam skript kita. Oleh karena itu sebaiknya selalu hindari penggunaan metode GET untuk mengirim data penting dan rahasia. Untuk keamanan data akan dibahas pada bab lainnya.

$_POST

Metode lainnya yang paling umum digunakan untuk mengirim data data adalah POST. Pada dasarnya POST mirip seperti GET dalam melakukan request dan cara mengaksesnya juga sama seperti pada GET. Kita mnggunakan $_POST sebagai array dan diikuti dengan nama variabel sebagai key pada array. Perbedaannya adalah data yang dikirim dengan metode POST tidak menggunakan query string tapi dimasukkan ke dalam HTML pada bagian content dari request. Untuk mengerti masalah ini silahkan lihat bab Pengenalan PHP.

Untuk memperjelas pemahaman tentang penggunaan POST pada PHP kita akan melihat latihan berikut

Latihan

  1. ketikkan kode berikut pada teks editor

<?php

//pastikan bahwa user meng-klik tombol daftar.

if($_SERVER[‘REQUEST_METHOD’] == ‘POST’) {

// tampilkan data yang telah simasukkan

echo “Terima kasih telah mendaftar <br />”,

“Username: “, htmlentities($_POST[‘nama’]), “<br />”,

“Email: “, htmlentities($_POST[’email’]), “<br />”;

} else {

// jika form tidak disubmit tampilkan?>

<form action=”testpost.php” method=”post”>

<label for=”nama”>Username:</label>

<input type=”text” name=”nama” />

<label for=”email”>Email:</label>

<input type=”text” name=”email” />

<input type=”submit” value=”Daftar” />

</form>

<?php }?>

  1. simpan dengan nama testpost.php pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testpost.php

pada latihan di atas kita menggunakan nama attribut sebagai key dari array $_POST. Misalnya jika kita ingin melihat nilai dari nama yang dimasukkan oleh user maka kita menggunakan $_POST[‘nama’].

Ketika kita menjalankan kode di atas dengan memanggil http://localhost/testpost.php, skrip PHP kita pertama sekali akan melakukan pengecekan apakah sudah ada data yang dikirim atau belum, jika sudah tampilkan data dan jika belum tampilkan form untuk melakukan input data.

Gambar x. form registrasi

setelah data di isi selanjutnya adalah menekan tombol submit. Tampilan setelah menekan tombol submit adalah sebagai berikut

Gambar x. tampilan setelah data di submit.

$_REQUEST

Superglobal Array $_REQUEST adalah sebuah array yang berisi seluruh data pada superglobal array $_GET, $_POST dan $_COOKIE. Latihan berikut ini akan menggunakan superglobal array $_REQUEST, sehingga kita akan lebih memahami fungsi dan penggunaan dari array ini.

Latihan

  1. ketikkan kode berikut pada teks editor

<?php

// seperti biasa kita mengecek apakah data sudah disubmit atau belum

if($_SERVER[‘REQUEST_METHOD’] == ‘POST’) {

// tampilkan isi dari $_REQUEST

foreach($_REQUEST as $key => $value) {

if($key!=”submit”){

echo “$key : $value <br />”;

}

}

} else {

// kalau belum ada data tampilkan form pendaftaran

?>

<form action=”testrequest.php” method=”post”>

<label for=”username”>Username:</label>

<input type=”text” name=”nama” />

<label for=”email”>Email:</label>

<input type=”text” name=”email” />

<input type=”submit” name=”submit” value=”Daftar” />

</form>

<?php } ?>

  1. simpan dengan nama testrequest.php pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testrequest.php

maka tampilan dari script di atas setelah kita memasukkan nama dan email kemudian menekan tombol Daftar adalah seperti berikut

Gambar x. tampilan setelah data dimasukkan pada testrequest.php

Sangat penting untuk mengetahui urutan dalam penggunaan $_REQUEST. Seandainya kita mendefinisikan nama yang sama untuk indeks dari array $_COOKIE, $_POST dan $_GET akan menyebabkan nilai dari array pada $_POST dan $_GET mengikuti nilai dari $_COOKIE atau dengan kata lain, nilai array pada $_COOKIE akan meng-override kedua array lainnya. Jika $_COOKIE tidak memiliki nama variabel atau key untuk array, maka $_POST akan meng-override $_GET.

$_FILE

HTML menyediakan fitur untuk meng-upload atau mengunggah file. Adakalanya ketika kita membuat sebuah situs kita harus dapat mengunggah gambar ke dalam situs kita. Untuk keperluan upload ini lah kita menggunakan superglobal $_FILE.

$_FILE memiliki prinsip kerja yang berbeda dengan $_POST dan $_GET. Pada $_FILE semua key untuk array adalah semua informasi yang berhubungan dengan file yang di-upload. Pada tabel berikut adalah key dari array $_FILE dan fungsinya

Pada superglobal Array $_FILE akan disimpan setiap file yang kita upload menggunakan multidimensional array. Untuk mengaksesnya kita menggunakan nama dari field sebagai array key dan kemudian key (yang tertera pada tabel di atas) yang ingin kita lihat isinya

$_FILES[‘avatar’][‘size’])

Pada latihan berikut ini kita akan membuat sebuah file php untuk mencoba penggunaan $_FILE, sehingga kita akan lebih memahami fungsi dari array ini. Yang harus diingat adalah menggunakan enctype=”multipart/form-data” pada tag form sehingga file bisa di upload.

Latihan

  1. ketikkan kode berikut pada teks editor

<?php

if($_SERVER[‘REQUEST_METHOD’] == ‘POST’) {

// apakah file yang di upload error atau tidak

if(isset($_FILES[‘gambar’]) && is_uploaded_file($_FILES[‘gambar’][‘tmp_name’]) && $_FILES[‘gambar’][‘error’]==UPLOAD_ERR_OK) {

// tampilkan data dari array $_FILE

foreach($_FILES[‘gambar’] as $key => $value) {

echo “$key : $value <br />”;

}

} else {

echo “No file uploaded!”;

}

} else {

// jika data belum disubmit munculkan form html untuk mengupload file

?>

<form action=”testfile.php” method=”post” enctype=”multipart/form-data”>

<label for=”gambar”>Gmbar :</label>

<input type=”file” name=”gambar” />

<input type=”submit” value=”Upload” />

</form>

<?php } ?>

  1. simpan dengan nama testfile.php pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testfile.php

maka tampilan ketika pertama kali dipanggil adalah sebagai berikut

setelah kita memilih file dengan meng-klik tombol Choose file maka tampilannya adalah sebagi berikut

kemudian ketika kita klik tombol upload maka semua informasi mengenai file yang kita upload akan ditampilkan seperti pada gambar berikut

HTML Form

HTML form atau yang lebih dikenal dengan istilah web form adalah kumpulan dari elemen HTML. Dengan menambahkan tipe elemen yang berbeda kita akan mendapatkan field yang berbeda pula seperti text field, check box dan field lainnya.

Semua web form akan menggunakan <form> sebagai tag pembuka dan </form> sebagai tag penutup.

<form action=”test.php” method=”post”>

<!– isi dari form –>

</form>

pada contoh di atas ada dua atribut pada tag <form>

  • action : Memberitahukan kepada web browser kemana harus mengirim form yang sudah diisi dan disubmit.

  • method : Pada bagian ini memberitahukan pada web browser bagaiman data tersebut dikirim. Pada bagian ini bisa menggunakan POST ataupun GET

Pada latihan berikut kita dapat melihat cara pembuatan form untuk proses registrasi yang berisi banyak field.

Latihan

  1. ketikkan kode berikut pada teks editor (kode ini dari buku Beginning PHP 5.3)

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml&#8221; xml:lang=”en” lang=”en”>

<head>

<title>contoh HTML Form</title>

<style type=”text/css”>

/* Forms */

label { display: block; float: left; clear: both; text-align: right; margin: 0.6em 5px 0 0; width: 40%; }

input, select, textarea { float: right; margin: 1em 0 0 0; width: 57%; }

input { border: 1px solid #666; }

input[type=radio], input[type=checkbox], input[type=submit], input[type=reset], input[type=button], input[type=image] { width: auto; }

</style>

</head>

<body>

<h1>Contoh HTML Form</h1>

<form action=”” method=”post”>

<div style=”width: 25em;”>

<label for=”textField”>A text input field</label>

<input type=”text” name=”textField” id=”textField” value=”” />

<label for=”passwordField”>A password field</label>

<input type=”password” name=”passwordField” id=”passwordField” value=”” />

<label for=”checkboxField”>A checkbox field</label>

<input type=”checkbox” name=”checkboxField” id=”checkboxField” value=”yes” />

<label for=”radioButtonField1″>A radio button field</label>

<input type=”radio” name=”radioButtonField” id=”radioButtonField1″ value=”radio1″ />

<label for=”radioButtonField2″>Another radio button</label>

<input type=”radio” name=”radioButtonField” id=”radioButtonField2″ value=”radio2″ />

<label for=”submitButton”>A submit button</label>

<input type=”submit” name=”submitButton” id=”submitButton” value=”Submit Form” />

<label for=”resetButton”>A reset button</label>

<input type=”reset” name=”resetButton” id=”resetButton” value=”Reset Form” />

<label for=”fileSelectField”>A file select field</label>

<input type=”file” name=”fileSelectField” id=”fileSelectField” value=”” />

<label for=”hiddenField”>A hidden field</label>

<input type=”hidden” name=”hiddenField” id=”hiddenField” value=”” />

<label for=”imageField”>An image field</label>

<input type=”image” name=”imageField” id=”imageField” value=”” src=”asterisk.gif” width=”23″ height=”23″ />

<label for=”pushButton”>A push button</label>

<input type=”button” name=”pushButton” id=”pushButton” value=”Click Me” />

<label for=”pullDownMenu”>A pull-down menu</label>

<select name=”pullDownMenu” id=”pullDownMenu” size=”1″>

<option value=”option1″>Option 1</option>

<option value=”option2″>Option 2</option>

<option value=”option3″>Option 3</option>

</select>

<label for=”listBox”>A list box</label>

<select name=”listBox” id=”listBox” size=”3″>

<option value=”option1″>Option 1</option>

<option value=”option2″>Option 2</option>

<option value=”option3″>Option 3</option>

</select>

<label for=”multiListBox”>A multi-select list box</label>

<select name=”multiListBox” id=”multiListBox” size=”3″ multiple=”multiple”>

<option value=”option1″>Option 1</option>

<option value=”option2″>Option 2</option>

<option value=”option3″>Option 3</option>

</select>

<label for=”textAreaField”>A text area field</label>

<textarea name=”textAreaField” id=”textAreaField” rows=”4″ cols=”50″> </textarea>

</div>

</form>

</body>

</html>

  1. simpan dengan nama testform.html pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testform.html

adapun tampilan dari kode di atas adalah sebagai berikut

Kode di atas dapat kita telaah untuk pembuataan web form dan input field.

  • Text field : bagian ini berfungsi untuk menerima input dalam satu baris, jika kita attribut value kita beri nilai, maka ini akan menjadi nilai default yang secara otomatis muncul ketika halaman dipanggil.

  • Password field : field ini berfungsi untuk meminta masukan berupa password dari user akan tetapi teks yang diketikkan oleh user tidak akan ditampilkan.

  • checkbox field : ini fungsinya sama seperti sebuah saklar yang hanya mempunyai nilai benar atau salah.

  • Two radio button fields : Radio button umumnya diletakkan dalam sebuah grup yang paling tidak mengandung dua buah radio button. Semua radio button di dalam grup memiliki nama yang sama dan hanya boleh memilih salah satu dari seluruh radio button yang berada dalam grup yang sama. Untuk radio button, attribut value harus memiliki nilai, sementara untuk field lain attribut ini dapat dikosongkan.

  • submit button : tombol ini jika di-klik akan mengirim data yang telah diisi pada web form ke server untuk diproses lebih lanjut.

  • Reset button : tombol ini berfungsi untuk mengososngkan semua field yang telah diisi kembali ke nilai defaultnya.

  • file select field : fungsi dari field ini adalah untuk mengijinkan user meng-upload file ke server.

  • hidden field : input jenis ini tidak akan ditampilkan pada web browser.

  • image field : hampir sama fungsinya seperti submit button, hanya saja pada field ini kita dapat memberikan gambar/icon pada button sebagai pengganti button standard.

  • Push button : tombol jenis ini tidak akan melakukan apapun secara default ketika diklik, tapi kita bisa menggunakan nya untuk memanggil kode-kode javascript.

  • pull-down menu : field ini akan mengijinkan user untuk memilih hanya satu pilihan dari list yang tersedia. Attribut size yang bernilai 1 berfungsi untuk memberitahukan kepada web browser bahwa kita ingin field ini ditampilkan dalam bentuk pull-down menu. Di dalam tag select berisi pilihan yang ingin kita tampilkan untuk dipilih. Kita akan memberi label antara tag <option> dan </option>. Setiap tag option memiliki attribut value yang dapat dikosongkan, namun jika diisi maka value ini yang akan dikirim ke server. Jika tidak diisi maka text di antara <option> dan </option> yang akan dikirim.

  • list box : field ini bekerja seperti puldown menu, hanya saja pada field ini semua pilihan ditampilkan. Untuk merubah pull-down menu menjadi field cukup dengan mengganti nilai dari attribut size dari 1 menjadi angka yang lain.

  • multi-select list box : field ini sama seperti field list box, hanya saja pada field ini kita boleh memilih lebih dari satu buah pilihan.

  • text area field : field ini mirip dengan text input field, hanya saja field ini dapat menerima lebih dari satu baris text. Pada field ini kita juga harus menentukan tinggi dan lebarnya.

Memproses Data Form dengan PHP

Sampai pada bagian ini kita diharapkan sudah bisa membuat form dengan HTML dan mengetahui bagaimana data ini dikirim ke server baik melalui metode POST atau GET. Sekarang yang akan kita pelajari adalah bagaimana sebuah skrip PHP menerima data ini untuk diproses lebih. Walaupun sebelumnya kita sudah banyak melihat contoh PHP yang digunakan untuk memproses data dari HTML form namun pada bagian ini kita akan membahasnya secara lebih mendetail.

Untuk masalah ini kita harus melihat kembali bentuk tag form yang memiliki dua atribut. Atribut pertama adalah action, yang diisi dengan URL atau path ke skrip PHP yang akan digunakan untuk memproses data dari form ini.

Misalkan kita ingin data dari form login di bawah ini diproses oleh sebuah skrip PHP yang bernama cek_login.php. Karena pada proses login data yang dikirim adalah username dan password maka kita akan menggunakan method POST. Maka form login adalah sebagai berikut :

<form action=”cek_login.php” method=”post”>

<label for=”username”>Username : </label>

<input type=”text” name=”username” id=”username” value=”” />

<label for=”password”>Password </label>

<input type=”password” name=”password” id=”password” value=”” />

</form>

Langkah selanjutnya kita harus membuat sebuah skrip PHP yang bernama cek_login.php yang akan digunakan untuk memproses data yang dikirim dari form di atas. Untuk membaca sebuah data dari sebuah form maka skrip PHP akan menggunakan salah satu superglobal operator yang sudah kita pelajari sebelumnya. Karena pada form di atas kita menggunakan metode POST untuk mengirim data, maka superglobal array yang akan kita gunakan adalah $_POST.

Untuk memproses data yang diterima dari HTML form umumnya data tersebut akan disimpan ke dalam sebuah variabel lainnya pada skrip PHP. Kita akan menyimpan data dari field username ke variabel $username dan $password untuk menyimpan data password yang dikirim.

$username = $_POST[‘username’];

$password = $_POST[‘password’];

dari contoh di atas dapat kita lihat bahwa yang digunakan sebagai key untuk superglobal array $_POST adalah nilai dari attribut name untuk tiap field. Pada contoh di atas attribute name bernilai username untuk input text, sehingga kita menggunakan $_POST[‘username’] karena format umum dari superglobal array $_POST adalah $_POST[‘nilai_dari_attribut_name’].

Latihan berikut ini akan mencoba membuat penjelasan dalam bentuk aplikasi PHP yang terdiri dari dua file, yaitu testlogin.html dan cek_login.php.

Latihan

  1. Ketikkan kode berikut pada teks editor

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml&#8221; xml:lang=”en” lang=”en”>

<head>

<title>Login Please</title>

</head>

<body>

<h1>Please enter your credential</h1>

<form action=”cek_login.php” method=”post”>

<label for=”username”>Username : </label>

<input type=”text” name=”username” id=”username” value=”” />

<label for=”password”>Password </label>

<input type=”password” name=”password” id=”password” value=”” />

<input type=”submit” name=”submit” id=”submit” value=”Login” />

</form>

</body>

</html>

  1. simpan dengan nama testLogin.html pada /var/www

  2. Ketikkan kode berikut pada teks editor

<html>

<head>

<title>Login Data</title>

</head>

<body>

<?php

$username = $_POST[‘username’];

$password = $_POST[‘password’];

echo “username is $username <br/><br/>”;

echo “password is $password <br/><br/>”;

?>

</body>

</html>

  1. simpan dengan nama cek_login.php pada /var/www

  2. panggil menggunakan browser pada alamat http://localhost/testLogin.html

maka tampilan pertama nya adalah sebagai berikut.

Gambar x.

Kemudian kita mengisi username dengan user dan password untuk password. Maka tampilannya dalah sebagai berikut sebelum tombol login ditekan.

Gambar x

setelah tombol login ditekan maka data username dan password akan dikirim ke cek_login.php, yang kemudian data ini pada cek_login.php akan ditampilkan seperti pada gambar berikut.

Gambar x.

sampai disini kita sudah mempelajari bagaiman PHP menangani data yang dikirim oleh sebuah HTML form dengan menggunakan superglobal array.