Setiap form yang diisi oleh pengguna mestilah di’valid’kan / diperiksa terlebih dahulu. Saya masih ingat lagi satu ayat dari sebuah buku PHP yang saya baca, “..Jangan percaya satu pun yang user anda masukkan! Check all of them!..”. Form Validation adalah antara benda yang mudah tapi leceh untuk dilaksanakan dengan menggunakan PHP. Tengok contoh di bawah:

if(!$name){
Name field missing!
}
 
if(!$age){
Age field missing!
}

Itu baru dua variable yang kita ‘valid’kan, cuba bayang kita ada 10 variable? sakit jugak nak buat tu. =) memang saya tak nafikan, bukannya tak boleh, tapi membazir masa. Untuk mengelakkan masalah ni, kita boleh menggunakan javascript. Lihat contoh di bawah;

Katakan kita ada satu form HTML seperti berikut;

<form action="xxxx.php" method="post" name="UD">
<table>
<tr>
<td>Name :</td>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<td>Age :</td>
<td><input type="text" name="age" /></td>
</tr>
<tr>
<td><input type="button" value="Submit" name="Submit" onclick="return validateForm()" /></td>
</tr>
</table>
</form>

*Pastikan form anda ada tag nama, sebagai contoh name=”UD”.
**Pastikan anda menambah attribute onclick=”return validateForm()” pada button submit anda.

Setelah selesai dengan form di atas, tambah kod javascript berikut di dalam file anda (anda boleh letak kod jscript tersebut sejurus selepas tag penutup head;

<script xsrc="JavaScript.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
function validateForm()
{
var count=0;
var msg="";
for(i=0;i<=2;i++)
{
if(document.UD.elements[i].value=="")
{
count=1;
msg=msg+"\n"+document.UD.elements[i].name;
}
else if((i>1) && (count==0))
{
return(true);
}
}
for(i=0;i<=2;i++)
{
if(document.UD.elements[i].value=="")
{
alert("Ruangan di bawah wajib di isi\n "+msg);
document.UD.elements[i].focus();
return(false);
}
}
}
//-->
</SCRIPT>

Jangan risau, saya akan terangkan bagaimana anda boleh menggunakan script ini untuk semua form anda nnt, hanya sekadar menukar sedikit nombor2 yang terdapat di dalam script itu, dan siap!

Jika anda perasan, dalam form saya HTML sebelum ini, saya meminta user masukkan nama dan juga umur mereka. Ini bermaksud dua input yang akan mereka masukkan. Perhatikan kod jscript dan cari line ini

for(i=0;i<=2;i++)

dan

for(i=0;i<=2;i++)

Tukar 2 mengikut jumlah input yang terdapat dalam form anda.

Kemudian cari line ini;

else if((i>1) && (count==0))

Tukar 1 mengikut jumlah input anda tolak 1 (jangan lupa, tolak satu!).

Siap! tanya di ruangan komen jika anda mengalami masalah tentang script ini. Selamat mencuba. Download contoh script di sini

Popularity: 5% [?]

• mdpai Says:
  May 30th, 2007 at 3:39 am

  terdapat sedikit pembetulan pada code jscript di atas

  script xsrc=”JavaScript.js” tuka jadi script src=”JavaScript.js”

• anas Says:
  May 31st, 2007 at 9:38 pm

  Saya ada solan tentang CSS. Perlukah kita guna coding dalam css 100% atau rojakan saja macam saya yang tak pandai coding (dlm 20% ja bolehlah). apa perlu sangat validation dari wc3 atau sbgnya. mmg masalahlah tambahan lagi tak ada basic dalam IT ni. Apakah jika dapat validation tu bermakna website kita sempurna atau bagaimana? saya akui akan kelemahan saya.

• mdpai Says:
  June 6th, 2007 at 1:30 pm

  Untuk awal2 tak jadi masalah kalau buat rojakan je, even saya pun tak buat full CSS untuk web client saya. Web yang menggunakan sepenuhnya CSS ni membolehkan web designer dia lebih kreatif.
  Ttg validation tu pula, bagi saya validation tu hanyalah sebagai kayu pengukur kepada satu2 web designer/developer tu sendiri. Asalkan web tu berfungsi dengan ok dan tiada bug, bg saya tu dah mencukupi.

• r0kawa Says:
  June 14th, 2007 at 7:45 am

  Kalau guna javascript, user boleh disable javascript. Still kena validate on server side. Lebih secure.