JQuery Datepicker adalah salah satu jquery yang sering digunakan dalam memilih tanggal, bulan, dan tahun. jQuery Datepicker cukup populer dikalangan web designer karena jQuery Datepicker memberikan kemudahan bagi pengguna website.
Berikut langkah penggunaan JQuery Datepicker,
1. Download JQuery UI di link Berikut, kemudain lakukan ekstrak file yang di download tersebut.
2. Buat folder js untuk menyimpan file
jquery-1.10.2.js dan jquery-ui.js. Folder themes untuk menyimpan file style jquery-ui.css.3. Include-kan file css dan js yang ada dalam folder ter-ekstrak tadi ke dalam tag <head> seperti berikut
<head>
<title>Sample Datepicker</title>
<link rel="stylesheet" href="themes/smoothness/jquery-ui.css">
<script src="js/jquery-1.10.2.js"></script>
<script src="ui/jquery-ui.js"></script>
</head>
4. Tuliskan script untuk memanggil datepicker,
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker();
});
</script>
5. Buat tag HTML nya,
<p><input type="text" id="datepicker"></p>
6. Berikut hasil dari script datepicker diatas
Script keseluruhan untuk memanggil datepicker
<html>
<head>
<title>Sample Datepicker</title>
<link rel="stylesheet" href="themes/smoothness/jquery-ui.css">
<script src="js/jquery-1.10.2.js"></script>
<script src="ui/jquery-ui.js"></script>
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker();
});
</script>
</head>
<body>
<p><input type="text" id="datepicker"></p>
</body>
</html>
Selamat mencoba dan semoga bermanfaat.
No comments:
Post a Comment