Hallo sobat KuPas kali ini KuPas mau Ngasih Informasi Bgagaimana caranya Validasi Form with Jquery
Bagi yang belum tau apa itu Jquery, KuPas Kasih tau deh..
Jquery sendiri sebenarnya adalah sebuah library javascript yang memungkinkan kita untuk membuat program web dengan memanfaatkan library javascript yang disediakan (didalam jquery), tanpa harus secara eksplisit kita menambahkan event atau pun properti pada halaman web tersebut.
JQuery merupakan salah satu library yang membuat program web di sisi klien (Client Side), tidak terlihat sebagai program JavaScript biasa, yang harus secara eksplisit disisipkan pada dokumen web.
Dalam contoh ini KuPas menggunakan plugins validate jquery yang dapat didownload langsung dari websitenya:
http://bassistance.de/jquery-plugins/jquery-plugin-validation Didalam file index.php atau tergantu dalam file utama program web kita, sisipkan script berikut ini untuk me-load jquery dan plugins jquery validate dan letakkan di bagian head.<script src="js/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="js/jquery.validate.js"></script> |
Selanjutnya buat script validasinya
<script language="JavaScript" type="text/JavaScript"> $(document).ready(function() { $("#myform").validate(); }) </script> |
Catatan : $(“#myform”) adalah id form yang akan kita validasi.
Contohnya adalah:
<form method=POST action='proses.php' id='myform'>
Contoh form yang akan di validasi: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script language="JavaScript" type="text/JavaScript">
$(document).ready(function() {
$("#myform").validate();
})
</script>
</head>
<body>
<h2>Add New User</h2>
<form method=POST action='proses.php' id='myform'>
<table class=data>
<tr>
<td class=ldata>Username</td>
<td class=data> : <input type=text name="id_user" class="required"> *</td>
</tr>
<tr>
<td class=ldata>Password</td>
<td class=data> : <input type=password name="password" class="required"> *</td>
</tr>
<tr>
<td class=ldata>Full Name</td>
<td class=data> : <input type=text name='full_name' size=30></td>
</tr>
<tr>
<td class=ldata>E-mail</td>
<td class=data> : <input type=text name='email' size=30></td>
</tr>
<tr>
<td class=ldata>Level</td>
<td class=data> : <input type=radio name='level' value='1' >Full Control
<input type=radio name='level' value='2' >Write & Delete (Except Manage User)
<input type=radio name='level' value='3' checked>Read Only
</td>
</tr>
<tr>
<td colspan=2 class=data>
<input type=submit value=Save>
<input type=button value=Abort onclick=self.history.back()></td></tr>
</table>
</form>
</body>
</html> Disclaimer : Artikel, atau apapun yang ada di blog ini kadang-kala berasal dari berbagai sumber media lain, dan Hak Cipta sepenuhnya dipegang oleh sumber lain tersebut. Jika kami salah dalam menentukan sumber yang asli, kami mohon maaf dan beritahu kami -di sini-
0 komentar:
Posting Komentar