Page Nav

HIDE

Grid

GRID_STYLE

Breaking News

latest

Form HTML dengan PHP

Kita pasti tidak asing dengan HTML. Form HTML ini dijumpai misalnya pada saat Anda diminta mengisi formulir pendaftaran di suatu situs, me...


Kita pasti tidak asing dengan HTML. Form HTML ini dijumpai misalnya pada saat Anda diminta mengisi formulir pendaftaran di suatu situs, mengisi buku tamu, mengisi jajak pendapat, dan lain-lain. Nah, jika form tidak lagi asing bagi Anda, mungkin yang terasa asing adalah bagaimana form tersebut diolah.
Bahasa pemrograman seperti PHP, ASP, JSP, dan juga Perl dapat digunakan untuk mengolah form HTML tersebut. Tentu saja kali ini kita akan berbicara mengenai bagaimana mengolah form HTML dengan menggunakan PHP.
Untuk mengetahui apa itu form HTML, berikut akan diberikan sintaks penggunaan form HTML tersebut:
<form name="[nama_form]" method="[post|get]" action="[proses]">
...isi dari komponen form...
</form>
Untuk mengatur agar form tersebut diolah oleh skrip PHP, maka argumen action harus diisi dengan nama sebuah file PHP. File inilah yang nantinya akan mengolah form tersebut.
Pertanyaannya adalah apanya yang akan diolah? Tentu saja adalah input yang diberikan kepada form HTML tersebut. Seperti kita tahu, komponen form HTML dapat berupa input teks, radio button, check box, textarea. Nah, nilai-nilai yang diberikan ke dalam komponen-komponen inilah yang nantinya diolah. Nilai-nilai tersebut nantinya akan "diproses" oleh skrip PHP dan disimpan dalam bentuk variabel. Nama variabel yang menyimpannya sama dengan nama komponen form HTML yang didefinisikan oleh argumen name. contohnya:

<HTML>
<HEAD>
<TITLE> Form HTML </TITLE>
</HEAD>
<BODY>
<form name="contoh" method="post" action="proses.php">
Nama Anda : <input type="text" name="nama"> <br />
Umur Anda : <input type="text" name="umur"> <br />
Email Anda : <input type="text" name="email"> <br />
<INPUT TYPE="submit">
</form>
</BODY>
</HTML>

Simpanlah form ini dengan nama file buat_form.html.
Nantinya jika form tersebut di-submit, input berupa nama, umur, dan email akan diolah di file proses.php. Di dalam file proses.php ini nantinya akan dikenal variabel dengan nama $nama, $umur, dan $email sesuai dengan nama komponen form HTML. Namun sayangnya hal ini tidak lagi berlaku sejak PHP 4.2.0 dan diatasnya, karena nilai register_globals di php.ini adalah off. Sebelum PHP 4.2.0 nilai register_globals adalah on. Sebagai gantinya, PHP memperkenalkan superglobals array untuk menangkap variabel-variabel tersebut. Superglobal arrays tersebut adalah $_POST dan $_GET. Penggunaan kedua variabel ini tergantung dari method yang digunakan oleh form HTML.
Kedua array ini bersifat asosiatif dan sebagai indeksnya adalah nama dari komponen form HTML yang didefinisikan oleh argumen name. Jadi untuk contoh form di atas, pada file proses.php akan dikenal array dengan nama $_POST['nama'], $_POST['umur'], dan $_POST['email'].
Anda juga dapat mengganti nilai register_globals di php.ini sesuai dengan keinginan Anda, akan tetapi jika nantinya Anda membuat aplikasi dan web hosting Anda lakukan di suatu server yang nilai register_globalsnya adalah off, maka aplikasi Anda tidak akan jalan. dan anda harus merubah aplikasi anda kembali.  Jadi akan lebih aman jika Anda menggunakan $_POST dan $_GET dan biarkan register_globals di php.ini dengan posisi off.
Sekarang mari kita akan membuat file proses.php yang akan mengolah input dari buat_form.html di atas.
<HTML>
<HEAD>
<TITLE> Proses Form HTML </TITLE>
</HEAD>
<BODY BGCOLOR=#FFFFFF>
<?php
$nama = $_POST['nama'];
$umur = $_POST['umur'];
$email = $_POST['email'];
echo "<h1> Hallo $nama </h1>";
?>
<h2> Selamat Datang, silahkan isi data anda </h2>
<?
echo "Umur Anda saat ini adalah ";
echo "$umur tahun <br />";
echo "Alamat email Anda adalah ";
echo "$email";
?>
</BODY>
</HTML>
Untuk mencoba aplikasi tersebut ada dua cara yang dapat digunakan. (Hal ini sangat penting untuk diperhatikan karena seringkali para pemula melakukan kesalahan). Cara yang pertama adalah menjalankan file buat_form.html secara offline atau mudahnya dengan mengklik ganda file tersebut. Cara ini sangat lazim dilakukan karena file berekstensi .html telah terasosiasi dengan browser sehingga klik ganda terhadap file tersebut akan otomatis dijalankan oleh browser. Jika cara ini yang Anda lakukan, maka Anda harus mengedit buat_form.html di bagian tag <form> menjadi sebagai berikut:
<form name="contoh" method="post" action="http://localhost/proses.php">
Sesuaikan nilai ACTION dengan letak file proses.php di komputer Anda.
Cara kedua adalah dengan menjalankan file buat_form.html secara online, jadi file tersebut dipanggil dengan menuliskan http://localhost/buat_form.html di bagian address browser. Jika file buat_form.html dan proses.php terletak dalam 1 direktori yang sama, maka file buat_form.html di atas tidak perlu Anda edit lagi.
  
Verifikasi form
Dalam pembuatan form, tentunya Anda ingin agar form tersebut diisi dengan benar. Untuk itu diperlukan suatu verifikasi form. Verifikasi form dapat dibuat dengan PHP (server side script) dan dapat juga dibuat dengan client side script seperti misalnya JavaScript. Jika verifikasi form tidak memerlukan data-data dari server sebagai pembanding, maka sebaiknya digunakan client side script. Pertimbangannya adalah client side script tidak memerlukan bandwidth karena langsung diolah oleh browser.
Berikut akan diberikan contoh verifikasi form baik menggunakan PHP maupun JavaScript.
Contoh yang pertama adalah verifikasi dengan menggunakan PHP. Ubahlah sedikit file form.htm pada atribut action tag <form> dari "proses.php" menjadi "valid.php". Kemudian buatlah file valid.php sebagai berikut:
<HTML>
<HEAD>
<TITLE> Verifikasi Form HTML </TITLE>
</HEAD>
<BODY>
<?php
// Verifikasi
$pesan = "Tekan tombol Back browser Anda";
if (empty($_POST['nama'])) {
    echo "Anda belum memasukkan nama Anda <br />";
    echo "$pesan";
} elseif (empty($_POST['umur']) || ($_POST['umur'] < 0) || (!is_numeric($_POST['umur']))) {
    echo "Input umur Anda salah <br />";
    echo "$pesan";
} elseif (empty($_POST['email']) || (!ereg("@",$_POST['email']))) {
    echo "Periksa kembali email Anda <br />";
    echo "$pesan";
} else {
$nama = $_POST['nama'];
$umur = $_POST['umur'];
$email = $_POST['email'];
echo "<h1> Hallo $nama </h1>";
?>
<h2> Selamat Datang di situs Saya </h2>
<?php
echo "Umur Anda saat ini adalah ";
echo "$umur tahun <br />";
echo "Alamat email Anda adalah ";
echo "$email";
}
?>
</BODY>
</HTML>
Sekarang coba jalankan file form.htm dengan sengaja melakukan beberapa kesalahan, misalnya tidak mengisi nama, mengisi umur dengan bilangan negatif atau dengan karakter selain bilangan, mengisi alamat email tanpa tanda “@”. Setelah Anda menekan tombol submit, maka akan nampak pesan kesalahan sesuai dengan kesalahan yang Anda lakukan. Tetapi jika Anda mengisi form tersebut dengan benar, maka Anda akan menerima ucapan selamat datang.
Contoh yang kedua adalah verifikasi form dengan menggunakan JavaScript. Buatlah sebuah form baru dengan nama javaform.html sebagai berikut:
<HTML>
<HEAD>
<TITLE> Verifikasi Form HTML </TITLE>
<script language="JavaScript">
function pesan() {
var nama = document.forms[0].elements[0].value;
var umur = document.forms[0].elements[1].value;
var email = document.forms[0].elements[2].value;
if (nama.length == 0) {
    window.alert("Anda belum memasukkan nama Anda");
} else {
if ((umur < 0) || (isNaN(umur)) || (umur.length == 0)) {
    window.alert("Input umur Anda salah");
} else {
if ((email.length == 0) || (email.indexOf("@",1) == -1)) {
    window.alert("Periksa kembali alamat email Anda");
} else {
    document.forms[0].submit();
}}}}
</script>
</HEAD>
<BODY BGCOLOR=#FFFFFF>
<h1> Selamat Datang di situs Saya </h1>
Silakan isi Data Anda <br />
<form name="data" method="post" action="proses.php">
<pre>
Nama Anda : <input type="text" name="nama">
Umur Anda : <input type="text" name="umur"> tahun
Email Anda : <input type="text" name="email">
<input type="button" value="Submit" onClick=pesan();>
</pre>
</FORM>
</BODY>
</HTML>

Pada form ini, jika Anda melakukan kesalahan pengisian, maka file proses.php tidak akan dipanggil, tetapi akan muncul kotak dialog yang berisi pesan kesalahan sesuai dengan kesalahan yang dilakukan. Nah selamat mencoba dan belajar.

Tidak ada komentar